0

Opa, estou usando o ChartJS para geração de gráficos, estou integrando com PHP para envio de json ao gráfico

php

$arrLabels = array("January","February","March");
$arrDatasets = array('label' => "My First dataset",'fillColor' => "rgba(220,220,220,0.2)", 'strokeColor' => "rgba(220,220,220,1)", 'pointColor' => "rgba(220,220,220,1)", 'pointStrokeColor' => "#fff", 'pointHighlightFill' => "#fff", 'pointHighlightStroke' => "rgba(220,220,220,1)", 'data' => array('28', '48', '40'));

$arrReturn = array(array('labels' => $arrLabels, 'datasets' => $arrDatasets));

print (json_encode($arrReturn));

js

var ctx = document.getElementById("salesChart");
var myChart = new Chart(ctx, {
    type: 'line',
    data: {
        data_retorno
    }
}); 

Valor de data_retorno

[  
   {  
      "labels":[  
         "January",
         "February",
         "March"
      ],
      "datasets":{  
         "label":"My First dataset",
         "fillColor":"rgba(220,220,220,0.2)",
         "strokeColor":"rgba(220,220,220,1)",
         "pointColor":"rgba(220,220,220,1)",
         "pointStrokeColor":"#fff",
         "pointHighlightFill":"#fff",
         "pointHighlightStroke":"rgba(220,220,220,1)",
         "data":[  
            "28",
            "48",
            "40"
         ]
      }
   }
]

Onde data_retorno é o retorno do ajax.

O gráfico que já está carregado com outros dados, ao receber este resultado, simplesmente as linhas desaparecem e não acontece nada

4
  • Talvez o data_retorno não está no formato que o chartjs espera. Pode compartilhar conosco o valor de data_retorno?
    – BrTkCa
    Commented 31/05/2017 às 12:11
  • Opa @LucasCosta editei a pergunta adicionando o valor de data_retorno, vlw
    – sNniffer
    Commented 31/05/2017 às 12:14
  • tente data: data_retorno[0] @sNniffer
    – BrTkCa
    Commented 31/05/2017 às 12:27
  • @LucasCosta deu erro Chart.js, erro:TypeError: can't assign to properties of (new String(" ")): not an object
    – sNniffer
    Commented 31/05/2017 às 12:33

1 Resposta 1

0

O formato dos dados do retorno tem dois detalhes que precisam se adeguar ao charjs, que são:

  • a propriedade data espera um objeto ao invés de um array
  • a propriedade datasets espera um array ao invés de um objeto

Partindo do princípio que seu retorno é esse, podemos adequar o data_retorno dessa forma:

var data_retorno = [...] // ... indica todo o conteúdo
data_retorno = data_retorno[0]; // pega o objeto dentro do array
data_retorno.datasets = [].concat(data_retorno.datasets); // cria um array como valor

JSFiddle: https://jsfiddle.net/wwrtynec/2/

1
  • Eu justamente converti o dataset para array @sNniffer, você pode verificar se ele já é um array, se for não usar a conversão [].concat..
    – BrTkCa
    Commented 31/05/2017 às 13:06

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .