谷歌图表从PHP阵列连续的X轴 [英] Google charts continuous x-axis from php array

问题描述

我使用了一些代码，可以很好地用mysql表格中的数据生成带有谨慎x轴的谷歌折线图。但是，当我将列类型更改为日期以使x轴持续不断时，我只是不断收到错误消息：

a.getTime是不是函数

这里是从mysql生成数组的代码。

 <？php 
 include（connect.php）; 
 $ qry =mysql query here; 
 $ result = mysqli_query（$ con，$ qry）; 
 mysqli_close（$ con）; 
 
 $ table = array（）; 
 $ table ['cols'] = array（
 
 array（'id'=>''，'label'=>'Date'，'type'=>'日期'），
数组（'id'=>''，'label'=>'Amount'，'type'=>'number'），
）; 
 $ rows = array（）; 
 foreach（$ result as $ row）{
 $ temp = array（）; 
 
 $ date1 = date_create_from_format（'Y-m-d H：i：s'，$ row ['Date']）; 
 $ date2 = date_format（$ date1，'d-m-Y'）; 
 $ temp [] = array（'v'=>（string）$ date2）; 
 $ temp [] = array（'v'=>（float）$ row ['Amount']）; 
 $ rows [] = array（'c'=> $ temp）; 
} 
 
 $ result-> free（）; 
 $ table ['rows'] = $ rows; 
 $ jsonTable = json_encode（$ table，true）; 
 echo $ jsonTable; 
？> 
  

我试过了各种各样的东西，比如日期格式等等，但是如果第一种类型仍然会出现同样的错误是日期。任何帮助将不胜感激。

编辑：
仍然遇到麻烦。我无法绕过它。以下是即时获取的数组输出。希望这有助于指出即将出错的地方。

编辑2：我现在有如下数组，但仍具有相同的a。 getTime错误。

  {cols：[
 {label：Reading Date，type：date }，
 {label：Cl Reading（mg \ / l），type：number}，
rows：[
 {c ：[{v：new Date（04 \ / 10 \ / 2015）}，{v：0.4}]，
 {c：[{v：新日期（04 \ / 11 \ / 2015）}，{v：0.45}]，
 {c：[{v：new Date（04 \ / 12 \ / 2015）}，{v：0.9}]，
 {c：[{v：new Date（04 \ / 01 \ / 2016） {v：0.5}]}，
 {c：[{v：new Date（04 \ / 02\ / 2016）}，{v：0.43}] }，
 {c：[{v：new Date（18 \ / 02\ / 2016）}，{v：0.6}]}]} 
  

解决方案

由于第一列中的值需要实际为 date 值。

尝试替换...

{c：[{v ：04-10-2015}，{v：0.4}]}

$ b $ {c：[{v：new Date（2015/10/04）}，{v：0.4}]}

使用...

  $ date1 = date_create_from_format（'Ymd H：i：s'，$ row ['Date']）; 
 $ date2 =new Date（\。date（m，$ date1）。/。date（d，$ date1）。/。date（Y， $ DATE1） \）。 
 $ temp [] = array（'v'=>（string）$ date2）; 
  

google.charts.load（'current'，{packages：[' corechart']，callback：drawChart}）;函数drawChart（）{var json = {cols：[{label：Reading Date，type：date}，{label：阅读（mg \ / l），type：number}]，rows：[{c：[{v：new Date（2015/10/04）}，{ v：0.4}]}，{c：{v：new Date（2015/11/04）}，{v：0.45}]}，{c：[ v：new Date（2015/12/04）}，{v：0.9}]}，{c：[{v：new Date（01/04/2016）} ，{v：0.5}]}，{c：[{v：new Date（02/04/2016）}，{v：0.43}]}，{c： [{v：new Date（02/18/2016）}，{v：0.6}]}]} var data = new google.visualization.DataTable（json）; var chart = new google.visualization.LineChart（document.getElementById（'chart_div'））; chart.draw（data，{}）;}

< ; script>< / div>< / code&

i use some code that works fine for producing a google line chart with a discreet x axis from data in a mysql table. But when i change the column type to "date" to make the x axis continous i just keep getting an error:

a.getTime is not a function

here is the code for producing the array from mysql.

    <?php
include("connect.php");
$qry = " mysql query here";
$result = mysqli_query($con,$qry);
mysqli_close($con);

$table = array();
$table['cols'] = array(

array('id' => '', 'label' => 'Date', 'type' => 'date'),
array('id' => '', 'label' => 'Amount ', 'type' => 'number'),
); 
$rows = array();
foreach($result as $row){
$temp = array();

$date1 = date_create_from_format('Y-m-d H:i:s', $row['Date']);
$date2 = date_format($date1, 'd-m-Y');
$temp[] = array('v' => (string) $date2);
$temp[] = array('v' => (float) $row['Amount']);
$rows[] = array('c' => $temp);
}

$result->free();
$table['rows'] = $rows;
$jsonTable = json_encode($table, true);
echo $jsonTable;
?>

Ive tried various things like date format, etc. but still get the same error if the cloumn 1 type is "date". Any help would be appreciated.

Edit: Still having trouble with this. I cant get my head around it. The following is the array output im getting at the minute. Hope this helps point where im going wrong.

Edit 2: I now have the array coming out as follows but still have the same a.getTime error.

{"cols":[
{"label":"Reading Date","type":"date"},
{"label":"Cl Reading(mg\/l) ","type":"number"},
"rows":[
{"c":[{"v":"new Date(04\/10\/2015)"},{"v":0.4}]},
{"c":[{"v":"new Date(04\/11\/2015)"},{"v":0.45}]},
{"c":[{"v":"new Date(04\/12\/2015)"},{"v":0.9}]},
{"c":[{"v":"new Date(04\/01\/2016)"},{"v":0.5}]},
{"c":[{"v":"new Date(04\/02\/2016)"},{"v":0.43}]},
{"c":[{"v":"new Date(18\/02\/2016)"},{"v":0.6}]}]}

解决方案

The error is thrown because the values in the first column need to be actual date values.

Try replacing...

{"c":[{"v":"04-10-2015"},{"v":0.4}]}

With...

{"c":[{"v":new Date("10/04/2015")},{"v":0.4}]}

Using...

$date1 = date_create_from_format('Y-m-d H:i:s', $row['Date']);
$date2 = "new Date(\"".date("m",$date1)."/".date("d",$date1)."/".date("Y",$date1)."\")";
$temp[] = array('v' => (string) $date2);

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

function drawChart() {
  var json = {
    "cols":[
      {"label":"Reading Date","type":"date"},
      {"label":"Cl Reading(mg\/l) ","type":"number"}
    ],
    "rows":[
      {"c":[{"v":new Date("10/04/2015")},{"v":0.4}]},
      {"c":[{"v":new Date("11/04/2015")},{"v":0.45}]},
      {"c":[{"v":new Date("12/04/2015")},{"v":0.9}]},
      {"c":[{"v":new Date("01/04/2016")},{"v":0.5}]},
      {"c":[{"v":new Date("02/04/2016")},{"v":0.43}]},
      {"c":[{"v":new Date("02/18/2016")},{"v":0.6}]}
    ]
  }

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

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

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

这篇关于谷歌图表从PHP阵列连续的X轴的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！