数据在chart.js上相互叠加

时间:2017-03-19 13:19:40

标签: javascript chart.js

在Chart.js中切割最后一个单元格,因此数据彼此相加。我该如何解决? http://prntscr.com/eltpni

这是我的配置

integrity

1 个答案:

答案 0 :(得分:0)

由于您没有提供图表配置,我假设您使用的是基于发布图像的时间刻度。

不幸的是,由于所有的格式变化和可能性,chart.js有时会自动调整时间刻度x轴。你可以做两件事之一来解决这个问题。扩展图表容器的大小(以便有更多空间来呈现图表)或手动配置时间刻度以优化其外观。

例如,您可以使用.dropdown-content { display: none; position: absolute; background-color: white; min-width: 160px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 4; } 属性以“秒”为单位显示比例。以下是相关配置:

time.unit

这是codepen来证明我的意思。

但要记住的一件事是,您配置的单元需要对图表中的数据有意义。例如,如果您尝试使用scales: { xAxes: [{ gridLines: { display: false, }, type: "time", time: { unit: 'second', } }] } 的时间单位但数据跨越多个小时或一天,那么它可能会崩溃页面(因为在这种情况下,chart.js会尝试绘制数千个网格线/刻度。 ..每秒一次)