在x轴上带有时间戳的静态图表 [英] Static chart with timestamp on x-axis

问题描述

我想创建一个从MySQL数据库提取的静态值图表. 图表格式为(x轴:dd/mm/yy hh:mm:ss(对应于mysql数据库的时间戳))，y轴为双精度值.我能够从MySql数据库成功检索这些值.我需要ZingChart

I want to create a static chart of values pulled out of a MySQL database. The chart format would be (x axis : dd/mm/yy hh:mm:ss (corresponding to timestamp of mysql database)) and y-axis would be a double value. I am able to successfully retrieve these values from MySql database.I want help plotting them by ZingChart

推荐答案

Nikita.

一旦从MySQL数据库中检索了值，您将需要将MySQL日期值转换为以毫秒为单位的Unix时间.我用MySQL日期值填充了一个$date数组，并对该数组进行了迭代，调用strtotime首先转换为Unix时间，然后乘以1000转换为毫秒.为了能够直接在循环中修改数组元素，我还先在$ value之前进行了按引用分配.

Once you've retrieved your values from your MySQL database, you'll want to convert the MySQL date values in to Unix time in milliseconds. I've populated a $date array with the MySQL date values, and iterated over the array, calling strtotime to first convert to Unix time, and multiplying by 1000 to convert to milliseconds. In order to be able to directly modify array elements within the loop, I've also preceded $value with to assign by reference.

foreach ($date as &$value){
  $value = strtotime( $value ) * 1000;
}

因此，现在$date数组中的值已转换为正确的格式，是时候从PHP数组创建JavaScript数组了.这可以使用join()完成:

So now that the values in the $date array have been converted to the proper format, it's time to create a JavaScript array from the PHP array. This can be done using join():

var dateValues = [<?php echo join($date, ',') ?>];

结果数组如下:

var dateValues = [1356994800000,1357081200000,1357167600000, ... ];

要在ZingChart中使用此数组，请在scale-x对象中将dateValues变量与"values"一起使用.要将Unix时间值转换回ZingChart中的日期，请添加"transform"对象，并将其设置为"type":"date".

To use this array in ZingChart, use the dateValues variable with "values" in the scale-x object. To convert the Unix time values back to dates in ZingChart, add the "transform" object, and set it to "type":"date".

"scale-x":{
  "values": dateValues,
  "transform":{
    "type":"date",
    "item":{
      "visible":false
    }
  }
},
...

这可以解决规模问题.要在图表中获取其他值，您需要执行几乎相同的操作.将PHP数组转换为JavaScript数组，并在图表JSON中使用array变量.

That takes care of the scale. To get your other values in the chart, you do pretty much the same thing. Convert the PHP arrays into JavaScript arrays, and use the array variable in your chart JSON.

使用PHP $ series数组:

With the PHP $series array:

var seriesValues = [<?php echo join($series, ',') ?>];

在图表JSON中:

"series":[
  {
    "values":seriesValues
  }
]

我已将所有内容汇总为一个 Github Gist .让我知道您是否有任何疑问！

I've compiled all of this in to a Github Gist for you. Let me know if you have any questions!

这篇关于在x轴上带有时间戳的静态图表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！