使用带有部分数据的Google Chart API创建图表

如何解决使用带有部分数据的Google Chart API创建图表

| 我想创建一个折线图。目前我的图看起来像这样数据是实时数据，因此图表应从上午9点开始，并沿x轴增加到下午4点当用户在中午12点生成图表时。我的预期结果是（注意：数据仅在12 PM之前可用。）我找不到生成上述部分图表的方法。任何想法？

解决方法

我希望我已经正确理解了。注释中的代码是数据的其余部分（从12pm到4pm）。没有此数据，图形将显示您需要的局部图形。

<html>
  <head>
    <script type=\"text/javascript\" src=\"https://www.google.com/jsapi\"></script>
    <script type=\"text/javascript\">
      google.load(\"visualization\",\"1\",{packages:[\"corechart\"]});
      google.setOnLoadCallback(drawChart);
      function drawChart() {
        var data = new google.visualization.DataTable();
        data.addColumn(\'string\');
        data.addColumn(\'number\');
        data.addRows(8);    
        data.setValue(0,\'9AM\');
        data.setValue(2,\'11AM\');
        data.setValue(4,\'1PM\');
        data.setValue(6,\'3PM\');
        data.setValue(7,\'4PM\');

        data.setValue(0,1,5480); // 9AM
        data.setValue(1,5475); // 10AM
        data.setValue(2,5490); // 11AM
        data.setValue(3,5490); // 12PM
        /*
        data.setValue(4,5500); // 1PM
        data.setValue(5,5490); // 2PM
        data.setValue(6,5530); // 3PM
        data.setValue(7,5560); // 4PM
        */

        var chart = 
           new google.visualization.AreaChart(document.getElementById(\'chart_div\'));
           chart.draw(data,{width: 500,height: 240,vAxis: {minValue: 5460,maxValue: 5560},colors: [\'#76A4FB\'],legend: \'none\'
                         });
           }
    </script>
  </head>
  <body>
    <div id=\"chart_div\"></div>
  </body>
</html>

我希望这有帮助。 , 您可以使用jqChart jQuery插件。请参阅以下示例： http://www.jqchart.com/samples/ChartAxes/DateTimeAxis http://www.jqchart.com/samples/RealTime/LiveData