简体   繁体   中英

How can I use 'timeofday' data type in a Google Charts Histogram?

I'm trying to create a histogram using Google's timeofday data type, but keep getting the error "Invalid Row Index NaN. Should be in the range [0-0]." when the chart loads. If I use number as the data type and change the arrays to integers it works, but that won't let me format as HH:MM:SS. Something tells me that timeofday might not be supported for a histogram, but I can't find anything in the docs to support that. Any thoughts on what I might be doing wrong?

google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);    

function drawChart() {
    var jsonData = {
      cols: [
        {
          type: 'timeofday',
          label: 'Clock-in'
        }
      ],
      rows: [
        { c: [{v: [8, 15, 0]}] },
        { c: [{v: [8, 30, 0]}] },
        { c: [{v: [8, 45, 0]}] }
      ]
    };

    var data = new google.visualization.DataTable(jsonData);

    var options = {
      title: 'Clock-in times',
      legend: { position: 'none' }
    };

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

This is a bug in the Google histogram implementation ( issue #2025 ).

In the meantime, the only way to get a histogram of timeofday values will be to put things into bins on the server side and render a bar chart.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM