Google картирует неправильную сортировку данных - PullRequest
Новая
       4

Google картирует неправильную сортировку данных

0 голосов
/ 26 октября 2018

Я хочу отсортировать данные по дате, но по какой-то причине они не отсортированы должным образом, например 

['Sep 28',2],
['Sep 27',2],
['Oct 02',1],
['Oct 01',1],
['Sep 28',1],
['Sep 27',4],
['Sep 26',2],

Так что они не отсортированы по дате.

Я получил данные из базы данных с помощью php

foreach ($array as $row){
    echo "['".date('M d', strtotime($row['date']))."',".$row['views']."],";
}

И данные отсортированы правильно, вот пример диаграмм, и вы можете увидеть проблему

https://codepen.io/anon/pen/bmzGdb

Ответы [ 2 ]

0 голосов
/ 27 октября 2018

Я нашел решение, если у кого-то есть такая же проблема, здесь есть решение.Сначала вам нужно найти первый и последний день в базе данных, например MIN(date) MAX(date), а затем ... 

$date_from = $rows['date_from'];
$date_from = strtotime($date_from);
$date_to  = $rows['date_to'];
$date_to = strtotime($date_to);

for ($i=$date_from; $i<=$date_to; $i+=86400)
{
  $vl = 0;
  $dt = date("Y-m-d", $i);
  foreach ($array as $row)
  {
    if ( $row["date"] == $dt)
    {
      $dt = $row["date"];
      $vl = $row["views"];
    }
  }
 echo "[new Date(".strtotime($dt)." * 1000),".$vl."],\n";
}

Этот пример работает вместе с ответом @WhiteHat выше

enter image description here

0 голосов
/ 26 октября 2018

данные приводят к строке в javascript, поэтому они будут сортироваться как строка.
вместо этого используйте реальную дату в JavaScript.
что-то вроде ... 

foreach ($array as $row){
    echo "[new Date(".strtotime($row['date'])." * 1000),".$row['views']."],";
}

, затем вы можете отформатировать дату для оси, используя опцию ... 

hAxis: {
  format: 'MMM dd'
}

ОБНОВЛЕНИЕ

, поскольку формат не включает время, ось X может повторять метки.
чтобы предотвратить, используйте пользовательские галочки. 

hAxis: {
  format: 'MMM dd',
  ticks: data.getDistinctValues(0)
}

где data - таблица данных Google ...

ОБНОВЛЕНИЕ 2

другой вариант для тиков - это создать свой собственный, основываясь на диапазоне дат графика ... 

var oneDay = (1000 * 60 * 60 * 24);
var hAxisTicks = [];
var dateRange = data.getColumnRange(0);
for (var i = dateRange.min.getTime(); i <= dateRange.max.getTime(); i = i + oneDay) {
  hAxisTicks.push(new Date(i));
}

hAxis: {
  format: 'MMM dd',
  ticks: hAxisTicks
}
...