如何使用PHP在Google Table Chart中订购日期？

Question

I'm creating a table using Google Table Charts and PHP. The table code is:

google.charts.load('current', {'packages':['table']});
google.charts.setOnLoadCallback(drawTable);

  function drawTable() {
        var data = google.visualization.arrayToDataTable([
          <?php echo $dados; ?>
          ]);
  var table = new google.visualization.Table(document.getElementById('table_div'));
  data.sort({column: 0, desc: true});
  table.draw(data, {showRowNumber: false, width: '100%', height: '100%'});
}

The PHP code (that gets the data) is:

$dados = "['Data','InfoX','InfoY'],";
for($i = 0; $i < count($vet); $i++){
  $original_Date = $vet[$i][0];
  $New_Date = date("d/m/Y", strtotime($original_Date));

  $dados .= "['".$New_Date."',".$vet[$i][2].",".$vet[$i][3].','."]";
  if ($i+1 < count($vet)){
  $dados .= ",";
}

Currently, the table looks like this:

As you can see, I have a problem with the way the first column is sorted (right now, it is ordering first by the day, then the month and the year).

I need to order the first column chronologically (year-month-day), but show it in a dd/mm/yyyy format (in HTML, it is like when you use data-search and data-order). Is there any option custom propriety or option that I need to use to solve my issue?

Thanks in advance for the answers and feel free to ask for more details if you need it.

Answer 1

the problem is the dates are coming across as strings.
with real dates, the sort function will work correctly.

try using the following php...

$New_Date = date("m/d/Y", strtotime($original_Date));

$dados .= "[new Date('".$New_Date."'),".$vet[$i][2].",".$vet[$i][3].','."]";

then in javascript, use a date formatter to format the date column...

google.charts.load('current', {'packages':['table']});
google.charts.setOnLoadCallback(drawTable);

function drawTable() {
  var data = google.visualization.arrayToDataTable([
    <?php echo $dados; ?>
  ]);
  var table = new google.visualization.Table(document.getElementById('table_div'));
  data.sort({column: 0, desc: true});

  var formatDate = new google.visualization.DateFormat({pattern: 'dd/MM/yyyy'});
  formatDate.format(data, 0);

  table.draw(data, {showRowNumber: false, width: '100%', height: '100%'});
}