How to display JSON date to javascript google chart

Question

I Badly needed a help with this, I need to output the the date from php json data from my database to Google Chart javascript. Here is my php json code:

$data_points = array();
while($row = mysqli_fetch_array($result)){  
$wholedate = $row['time_stamp'];    
$monthNum = date('m',strtotime($row['time_stamp']));
$DayNum = date('d', strtotime($row['time_stamp']));   
$yearnum = date('Y', strtotime($row['time_stamp']));   
$dateObj   = DateTime::createFromFormat('!m', $monthNum);
$monthName = $dateObj->format('F');
if($monthNum == "9"){
      if (array_key_exists($DayNum, $data_points)) {
      $data_points[$DayNum]->ph += $row['ph'];
      $data_points[$DayNum]->moist += $row['moist'];
          }else{
      $data_points[$DayNum]->ts = $yearnum."".$monthNum."".$DayNum;    
      $data_points[$DayNum]->ph = $row['ph'];
      $data_points[$DayNum]->moist = $row['moist'];   
  }
}

  }
$jsonResult = json_encode(array_values($data_points));
echo $jsonResult;

The Code Above outputs the following:

[{"ts":"20170915","ph":"8","moist":"1"},{"ts":"20170913","ph":"8","moist":"1"},{"ts":"20170916","ph":"3","moist":"1"},{"ts":"20170908","ph":"2","moist":"1"},{"ts":"20170901","ph":"3","moist":"5"},{"ts":"20170902","ph":1064,"moist":15},{"ts":"20170906","ph":1896,"moist":0}]

And here is a line from my javascript code for my date it doesnt output the exact date coming from my json:

$.each(results, function (i, row) {
          var dbdate = new Date(<?php echo $jsonResult;?>)
          console.log(dbdate)

          data.addRow([
          new Date(dbdate.getFullYear(), dbdate.getMonth(), row.ts),
         // new Date(dbdate.getFullYear()row.ts),
          parseFloat(row.ph),
          parseFloat(row.moist)
            ]);
          });

Think about what you put there in your date function ... you have to parese the json output — Simon Müller, Sep 06 '17 at 23:31
Is your actual question: "*How do I parse a string like 20170915 to a Date*"? — RobG, Sep 06 '17 at 23:53
if you want to pass a date in json from php to google charts without manipulation on the client, check [this answer](https://stackoverflow.com/a/39756555/5090771)... — WhiteHat, Sep 07 '17 at 00:36

score 0 · Answer 1 · answered Sep 07 '17 at 00:03

Presumably you're asking how to get timestamps from some JSON and convert them to Dates.

Start by parsing the JSON, then get the timestamps, then parse them to Dates. All of these questions have been answered before but likely this is a duplicate of Why does Date.parse give incorrect results? which should probably be renamed How do I parse a string to a date and why shouldn't I use the built-in parser?:

var text = '[{"ts":"20170915","ph":"8","moist":"1"},{"ts":"20170913","ph":"8","moist":"1"},{"ts":"20170916","ph":"3","moist":"1"},{"ts":"20170908","ph":"2","moist":"1"},{"ts":"20170901","ph":"3","moist":"5"},{"ts":"20170902","ph":1064,"moist":15},{"ts":"20170906","ph":1896,"moist":0}]';

// Parse JSON
var arr = JSON.parse(text);

// Get timestamps and parse to Dates
// Helper: parse yyyymmdd to Date
function parseDate(s) {
  var b = s.match(/\d\d/g);
  return new Date(b[0] + b[1], b[2]-1, b[3]);
}

// Display dates
arr.forEach(function(obj) {
  console.log(parseDate(obj.ts).toString());
});

You'll likely also be interested in Where can I find documentation on formatting a date in JavaScript?

thanks for your Reply.and I very much appreciated but I would like to ask from the code of yours for example the var text ,what if the json is from the other file which is in a database form.How can be this possible — njhelloworld, Sep 09 '17 at 15:24

score 0 · Accepted Answer · answered Sep 10 '17 at 01:20

I created the following line:

$wholedate=date('c',strtotime($row['time_stamp']));

And assigned it to the array time_stamp:

$data_points[$DayNum]->time_stamp =$wholedate;

then on my Javascript I just assigned the jsonData to the google visualization:

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

Now it works at least, thus I still dont know if there's a disadvantage with those codes..

How to display JSON date to javascript google chart

2 Answers2