如何使用PHP在Google Table Chart中订购日期?
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.
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%'});
}