Javascript 去掉图表js折线图中的竖线
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/27182829/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Remove the vertical line in the chart js line chart
提问by Thomas Sebastian
I am using Chart.jsto generate maps and have customised it to a good extent. But I am not able to remove the vertical grid line no matter what. Has anyone come across a situation like this? Help much appreciated.
我正在使用Chart.js生成地图并在很大程度上对其进行了自定义。但是无论如何我都无法删除垂直网格线。有没有人遇到过这样的情况？非常感谢帮助。
JavaScript
JavaScript
var ChartDataHome = {
labels: ["",
"NOV", "DEC", "JAN", "FEB",
],
datasets: [{
strokeColor: "rgba(255.255,255,1)",
pointColor: "rgba(159,209,154,1)",
pointStrokeColor: "rgba(255,255,255,1.00)",
data: [4.5, 8.8, 7.5, 9.5, 7.8, 9]
}, ]
};
var step = 2;
var max = 10;
var start = 0;
ChartOptionsHome = {
scaleLabel: "<%= value + ' K ' %>",
pointDot: false,
bezierCurve: false,
scaleOverride: true,
scaleSteps: 10,
// scaleStepWidth: Math.ceil(4/2),
scaleSteps: Math.ceil((max - start) / step),
scaleStepWidth: step,
scaleStartValue: start,
scaleShowGridLines: true,
scaleGridLineWidth: 0,
scaleGridLineColor: "rgba(0,0,0,0.1)",
datasetFill: false,
animation: true,
animationSteps: 60,
scaleFontColor: "#ffffff",
scaleFontSize: 14,
scaleLineColor: "rgba(255,255,255,1)",
datasetStrokeWidth: 6,
responsive: true,
}
ChartOptions = {
}
if ($("#chartHome")[0]) {
DrawTheChart(ChartDataHome, ChartOptionsHome, "chartHome", "Line");
}
回答by xnakos
The following applies to Chart.js 2.*.
以下内容适用于 Chart.js 2.*。
If you only have one x-axis, whether the vertical grid lines (that are related to this x-axis) are displayed or not, is specified by the boolean value of options.scales.xAxes[0].gridLines.display. To be more precise, the following chart options disable the display of vertical grid lines for the single x-axis case.
如果只有一个 x 轴，则是否显示垂直网格线（与此 x 轴相关）由 的布尔值指定options.scales.xAxes[0].gridLines.display。更准确地说，以下图表选项禁用了单 x 轴情况下垂直网格线的显示。
options : {
scales : {
xAxes : [ {
gridLines : {
display : false
}
} ]
}
}
回答by JBMcClure
There's a new global option that was released with the new version of Chart.js two days ago.
两天前随新版本的 Chart.js 发布了一个新的全局选项。
var options = {
scaleShowVerticalLines: false
}
回答by Valera Checha
options : {
scales: {
yAxes: [{
gridLines: {
lineWidth: 0,
color: "rgba(255,255,255,0)"
}
}]
}
};
Charts.js v2.0
回答by Atul Nar
try "scaleShowGridLines" : false,
尝试 "scaleShowGridLines" : false,
回答by yinyin
I think you can seperate x and y axis.
我认为你可以分开 x 和 y 轴。
axes: { xaxis: { ticks: ticks, tickOptions: {showGridline:false} }, yaxis: { tickOptions: {showGridline:true} } }
axes: { xaxis: { ticks: ticks, tickOptions: {showGridline:false} }, yaxis: { tickOptions: {showGridline:true} } }
Hope this can help you.
希望这可以帮到你。
