Как отобразить получасовые тики по осям x

#chart.js

#chart.js

Вопрос:

У меня есть запись с данными за последние 36 часов. Они должны отображаться в моем Chart.js -График таков, чтобы каждые 30 минут ставилась галочка. Если набор данных попадает на xx:45, его не следует округлять до 30-минутного интервала.

У меня такое чувство, что я еще не правильно понял термины «тики» и «единицы измерения». Я хочу иметь вертикальные линии каждые 30 минут, но наборы данных должны быть свободно распределены по оси x.

 {
...
   type: "time",
   time: {
       unit: "minute",
       displayFormats: {
           minute: "HH:mm"
       },
       stepSize: 30
   },
   gridLines: {
       drawOnChartArea: true,
       color: ["transparent", ...Array(Math.max(0, countDays(bedCapacities) - 2)).fill("#DFF2FA"), "#303740"],
       zeroLineColor: "#DFF2FA",
       drawBorder: true,
       tickMarkLength: -20
   },
   ticks: {
       fontColor: "#CCCCCC",
       fontSize: 11,
       fontStyle: "bold",
       labelOffset: 20,
       source: "auto"
}
  

Ответ №1:

Это моя настройка, использующая версию v3.6.0. Вы можете игнорировать ось y, просто дайте вам знать, что моя работает.

 scales: {
        x: {
          type: 'time',
          time: {
            unit: 'minute',
            stepSize: 30
          },
          min: tradingDuration().openTime,
          max: tradingDuration().closeTime
          // title: {
          //   display: true,
          //   text: 'Date'
          // }
        },
        y: {
          min: limitDown,
          max: limitUp
        }
      },
  

Комментарии:

1. Похоже, что он использует V2, в то время как ваш ответ находится в синтаксисе V3, возможно, вы захотите изменить его, чтобы он был более актуальным