ChartJS 海图发行

axkjgtzd  于 2023-02-12  发布在  Chart.js
关注(0)|答案(1)|浏览(158)

正如你在下面的例子中所看到的,我的日期是从2022-11-24开始的,但是在图表中它是从2022-11-23开始的,所有其他的日期都相差了大约一天。是什么导致了这个问题?谢谢!

7uzetpgm

7uzetpgm1#

这个问题是由于本地时间与Zulu/UTC时间的时间偏移引起的。您的时区 (可能) 有一个负偏移,这就是为什么它看起来关闭了几个小时。
我的时间偏移是正的(+02:00),所以它看起来对我来说很好(图表开始于24.11或多或少)。只要在您的数据中使用localtime datetime,您就不会再遇到这个问题了。(如果您不需要/使用它,请删除时间部分-〉'2022 - 11 - 24')

    • 为了演示,我删除了日期数据集中的(Zulu)Z,以显示以下情况:**
  • (由于此更改,日期时间项现在解释为本地时间)*
  1. let chart_dates = [
  2. '2022-11-24T00:00:00', '2022-11-25T00:00:00', '2022-11-26T00:00:00',
  3. '2022-11-27T00:00:00', '2022-11-28T00:00:00', '2022-11-29T00:00:00',
  4. '2022-11-30T00:00:00', ];
  5. let chartDataSet = [
  6. {"label":"A","data":[0,23,0,0,25,31,2],"lineTension":0.2,"borderColor":"#4e73df"},
  7. {"label":"B","data":[0,1,0,0,18,6,0],"lineTension":0.2,"borderColor":"#1cc88a"},
  8. ];
  9. new Chart(document.getElementById("chartJSContainer"), {
  10. type: 'line',
  11. data: {
  12. labels: chart_dates,
  13. datasets: chartDataSet
  14. },
  15. options:{
  16. maintainAspectRatio: false,
  17. scales: {
  18. x: {
  19. type: 'time',
  20. time: {
  21. unit: 'day'
  22. }
  23. }
  24. }
  25. }
  26. });
  1. <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.9.1/chart.js"></script>
  2. <script src="https://cdn.jsdelivr.net/npm/moment@^2"></script>
  3. <script src="https://cdn.jsdelivr.net/npm/chartjs-adapter-moment@^1"></script>
  4. <div class="chart" style="height:184px;width:500px">
  5. <canvas id="chartJSContainer" width="600" height="400"></canvas>
  6. </div>
展开查看全部

相关问题