【问题标题】:Google-chart trendline not showing谷歌图表趋势线未显示
【发布时间】:2019-05-29 19:17:07
【问题描述】:

Google 图表趋势线未显示。试图将代码放在 vAxis、hAxis 中,并且只放在选项中,但没有运气。我知道第一列必须是数字或日期等等,而我的第一列是日期。

 <script type="text/javascript">
  data.sort([{column: 0}]);
  google.charts.load('current', {'packages':['corechart']});
  google.charts.setOnLoadCallback(drawChart);

  function drawChart() {
    var data = google.visualization.arrayToDataTable([
      ['Date', 'Sum'],
       <?php while($row = mysqli_fetch_assoc($result)) { ?>

      [<?php echo $row['date'] ?>,  <?php echo $row['col2'] ?> ],

    <?php } ?>
    ]);

    var options = {
         legend: { position: 'bottom' },
        title: 'Sum per day',
         hAxis : { textStyle : { fontSize: 10 } },
    vAxis: { viewWindowMode: 'explicit', viewWindow: { min: 0 } },
    trendlines: { 0: {} }
    };

    var chart = new google.visualization.LineChart(document.getElementById('line_chart'));
    chart.draw(data, options);
  }
</script>

【问题讨论】:

  • 是的,当然它是一个字符串,我编辑了我的代码,但现在它看起来像这样,见图。
  • 在绘制图表之前尝试对数据进行排序 --> data.sort([{column: 0}]);
  • 我不知道该放在哪里。我编辑了我的代码。你能看看吗?它不起作用,正如您从第一张图片中看到的那样,日期不匹配。它应该是 2019-01-01 等等,但它是 1,985 等等。也许是因为我在查询中使用了 GROUP BY 日期?
  • 我有 id、date(日期)、col2(int11)。在字段中:格式为 2019-05-29 和 col2 中的日期只是一个数字,没有小数

标签: google-visualization trendline


【解决方案1】:

加载数据时,需要将第一列从字符串转换为日期。
将 php 中的值放在引号中并放在日期构造函数中。

例如

[new Date('<?php echo $row['date'] ?>'),  <?php echo $row['col2'] ?> ],

如果你仍然对波浪线有问题,
在绘制之前对数据进行排序...

data.sort([{column: 0}]);
var chart = new google.visualization.LineChart(document.getElementById('line_chart'));
chart.draw(data, options);

【讨论】:

  • 我可以问另一个吗?如果我在我的 mysql 中使用 GROUP BY YEARWEEK 然后使用这个: new Date('') 它没有显示 yearweek,它只显示年月。一直在尝试,但没有成功...
  • JavaScript 中的date constructor 没有年-周的签名,您应该继续创建正常的日期,然后转换为周,参见 --> get week of year in javascript like in php
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2014-01-08
  • 1970-01-01
  • 1970-01-01
  • 2021-08-09
  • 1970-01-01
相关资源
最近更新 更多