Error with popular google charts

Question

Error with popular google charts

Navigation

#1 by (1 votes)

1

I'm encountering the following error:

VM3611: 231 Uncaught Error: Unknown header type: 6

Code:

google.charts.load('current', {'packages': ['corechart']});
google.charts.setOnLoadCallback(drawChart);

function drawChart() {
    var jsonData = $.ajax({
        url: "/client/ajax",
        dataType: "JSON",
        async: false
    }).responseJSON;

    var data = google.visualization.arrayToDataTable([
        ['Name' , 'Tickets']
    ]);

    for(var i=0;i<jsonData.length;i++){
        var array = [jsonData[i].Name , jsonData[i].Tickets]
        data = (google.visualization.arrayToDataTable([
            array
        ]));
    }
    var chart = new google.visualization.L

ineChart(document.getElementById('chart_div'));
chart.draw(data);

I've never used the charts, I wonder if I'm doing it right? And the reason for the mistake? Thank you community!

javascript jquery header google-charts

asked by anonymous 29.07.2016 / 18:34

1 answer

Get a circle from Openlayers 3 How to download WebView files to the SDCard if available

score 1 · Accepted Answer

In the way I could see the data, I called arrayToDataTable() only once. See the code below.

As for errors, I just found a syntax error. In the posted code, the} is missing at the end of the function. I believe the code did not run because arrayToDataTable () was being called repeatedly for each JSON array, and in fact it needs the header line.

The JSON data was changed to static. I hope it helps!

   google.charts.load('current', {packages: ['corechart']});
   google.charts.setOnLoadCallback(drawChart);

   function drawChart() {
     var jsonData = [
       { "Name": "Joe", "Tickets": 300 },
       { "Name": "Karl", "Tickets": 200 },
       { "Name": "Tina", "Tickets": 900 },
     ];
       
     var dataArray = [
       ['Name' , 'Tickets'],
     ];

     for(var i=0;i<jsonData.length;i++){
       var row = [jsonData[i].Name , jsonData[i].Tickets];
       dataArray.push(row);
     }

     var data = google.visualization.arrayToDataTable(dataArray);

     var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
     chart.draw(data);
   }

#chart_div {
       height: 100%;
   }

<div id="chart_div">
  </div>
<script src="https://www.gstatic.com/charts/loader.js"></script>