这是我的代码。我需要在x和y轴刻度中将初始值设置为“0”。我已经尝试过最新的版本比例选项。
graphOptions = {
///Boolean - Whether grid lines are shown across the chart
scaleShowGridLines: false,
tooltipTitleTemplate: "<%= label%>",
//String - Colour of the grid lines
scaleGridLineColor: "rgba(0,0,0,.05)",
//Number - Width of the grid lines
scaleGridLineWidth: 1,
//Boolean - Whether to show horizontal lines (except X axis)
scaleShowHorizontalLines: true,
//Boolean - Whether to show vertical lines (except Y axis)
scaleShowVerticalLines: true,
//Boolean - Whether the line is curved between points
bezierCurve: true,
//Number - Tension of the bezier curve between points
bezierCurveTension: 0.4,
//Boolean - Whether to show a dot for each point
pointDot: true,
//Number - Radius of each point dot in pixels
pointDotRadius: 4,
//Number - Pixel width of point dot stroke
pointDotStrokeWidth: 1,
pointHitDetectionRadius: 20,
datasetStroke: true,
datasetStrokeWidth: 2,
datasetFill: true,
legendTemplate: "<ul class=\"<%=name.toLowerCase()%>-legend\"><% for (var i=0; i<datasets.length; i++){%><li><span style=\"background-color:<%=datasets[i].strokeColor%>\"></span><%if(datasets[i].label){%><%=datasets[i].label%><%}%></li><%}%></ul>"
};
var LineChart = new Chart(ctx).Line(graphData, graphOptions);
}
答案 0 :(得分:186)
对于Chart.js 2. *,缩放从零开始的选项列在configuration options of the linear scale下。这用于数值数据,最有可能是y轴的情况。所以,你需要使用它:
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero: true
}
}]
}
}
示例折线图也可用here,其中该选项用于y轴。如果您的数字数据位于x轴上,请使用xAxes
代替yAxes
。请注意,数组(和复数)用于yAxes
(或xAxes
),因为您可能还有多个轴。
答案 1 :(得分:2)
请添加此选项:
//Boolean - Whether the scale should start at zero, or an order of magnitude down from the lowest value
scaleBeginAtZero : true,
(参考:Chart.js)
N.B:我发布的原始解决方案是针对Highcharts,如果您不使用Highcharts,请删除标签以避免混淆
答案 2 :(得分:0)
如果像我一样,您可能需要将其用作默认配置,只需将min: 0
放在节点defaults.scale.ticks
内,如下所示:
defaults: {
global: {...},
scale: {
...
ticks: { min: 0 },
}
},
答案 3 :(得分:0)
现在(5 年后和 3.x 版)有点不同
options: {
scales: {
y: {
beginAtZero: true
}
}
}