我正在使用 canvasjs
以图表格式显示数据。除了日期之外,一切正常
当数据较少时重复。
这是我的 JS
var chartResponses = new CanvasJS.Chart("chartResponses", {
animationEnabled: true,
toolTip: {
enabled: true,
animationEnabled: true,
fontColor: "#F9BF97",
},
axisX: {
titleFontFamily: "verdana",
valueFormatString: "D/M/YYYY",
tickThickness: 0,
lineThickness: 1,
gridThickness: 0,
gridColor: "#f2f6f7",
lineColor: "#f2f6f7",
labelFontColor: "#8fa2aa",
labelFontSize: 12,
intervalType: "day",
},
axisY: {
titleFontFamily: "verdana",
valueFormatString: "0",
tickThickness: 0,
lineThickness: 0,
gridThickness: 1,
gridColor: "#f2f6f7",
lineColor: "#f2f6f7",
labelFontColor: "#8fa2aa",
labelFontSize: 12
},
data: [{
type: "splineArea",
showInLegend: true,
markerSize: 0,
name: "",
color: "#F9BF97",
dataPoints: allResponses
}],
});
chartResponses.render();
当我只有两个日期时它如何显示图表
我尝试将间隔设置为间隔:1
。在这种情况下,较少的数据图表工作正常,但当我有更多数据时,日期开始重叠,如下图所示。
但是当我删除 interval: 1
时,它显示得很好
那么有什么办法可以解决这个问题吗?
最佳答案
当您有更多数据时,您必须将间隔属性更改为 5 或更多,否则按周或月更改间隔类型属性。如这个更新的 fiddle 所示。 jsfiddle.net/hb5KU/66/
您可以在将来根据您的响应数据长度渲染图表之前添加它。
关于javascript - canvas js 日期在 x 轴上重复,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39072746/