Как создать пустые точки на графике ApexCharts для отображения несуществующих дат из базы данных?

Как я могу улучшить график продаж, если на 16 мая что-то не так?
  • 18 апреля 2024 г. 5:09
Ответы на вопрос 2
Для создания пустых точек на графике ApexCharts для отображения несуществующих дат из базы данных, можно использовать свойство "missing" в опциях графика. Пример кода:

```javascript
options: {
    chart: {
      type: 'line',
    },
    series: [{
      data: [30, 40, 55, {y: 50, missing: true}, 0, 60, 80]
    },
  }
```

Чтобы улучшить график продаж, если на 16 мая что-то не так, можно добавить аннотацию или маркер в эту точку на графике, чтобы обратить внимание на это событие. Например, можно добавить вертикальную линию или текстовую подпись рядом с точкой на графике, чтобы указать на проблему или аномалию в данных. Также можно показать эту информацию в виде всплывающего окна при наведении на точку на графике.
Принцип заполнения пустых дат всегда один и тот же: 

// получаем
$sql = 'SELECT DATE(datetime) `date`, count(id) `count` FROM sells WHERE id != 1 GROUP BY DATE(datetime)';
$result = $conn->query($sql);
$sales = [];
// индексируем
while($row = mysqli_fetch_array($result)) {
    $sales[$row['date']] = $row['count'];
}
// создаем нужный интервал
$begin = new DateTime($date_begin);
$end = new DateTime($date_end);
$interval = DateInterval::createFromDateString('1 day');
$period = new DatePeriod($begin, $interval, $end);
// заполняем итоговый массив
$result = []
foreach ($period as $day) {
    $date = $dat->format("Y-m-d");
    $result[$day] = $sales[$day] ?? 0;
}
// выводим
echo "var rows=".json_encode(array_keys($result));
echo "var values=".json_encode(array_values($result));


Даты начала и конца обычно задаются заранее. Но если их наlо получить из результатов запроса, то
$date_begin = array_key_first($sales);
$date_end = array_key_last($sales);
Похожие вопросы