如何在Chart.js折线图上自定义y轴标签？
gitb
我有以下图表，想手动设置Y轴标签。而不是使用1,2,3,4,5，我想要一个，两个，三个，四个，五个。
有没有办法做到这一点？这是我的期权结构：
options = {
scales: {
yAxes: [{
scaleLabel: { labelString: ["One", "Two", "Three", "Four", "Five"] },
ticks: { min: 1, max: 5, stepSize: 1, suggestedMin: 0.5, suggestedMax: 5.5},
gridLines: {display: false}
}]
},
};
桲
在ticks对象中，您可以传递callback，该对象将获得即将显示的标签。在这里，您只需返回要显示的字符串来代替标签。
ticks: {
min: 0,
max: 5,
stepSize: 1,
suggestedMin: 0.5,
suggestedMax: 5.5,
callback: function(label, index, labels) {
switch (label) {
case 0:
return 'ZERO';
case 1:
return 'ONE';
case 2:
return 'TWO';
case 3:
return 'THREE';
case 4:
return 'FOUR';
case 5:
return 'FIVE';
}
}
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
在chart.js 中使用自定义数据格式进行多轴折线图
- 2
如何自定义Chart.js折线图的工具提示？
- 3
如何在Shield UI JavaScript折线图中添加自定义标签
- 4
如何在熊猫的X或Y轴上自定义轴刻度标签？
- 5
如何在具有多个y轴的多折线图上绘制数据点
- 6
如何创建带有锁定y轴的水平滚动Chart.js折线图？
- 7
Chart.js-y轴自定义标签
- 8
Chart.js-y轴自定义标签
- 9
Python Matplotlib-如何仅在折线图上注释y轴值？
- 10
如何为Google折线图/ Google折线图图例操作编写自己的自定义图例
- 11
如何在自定义WPF控件（如折线图）中呈现动态数据？
- 12
如何在D3折线图中自定义色阶？
- 13
如何在自定义WPF控件（如折线图）中呈现动态数据？
- 14
折线图chart.js上有两个不同的x轴标签
- 15
如何摆脱折线图上每个点顶部的折线（Chart.js）
- 16
如何在highChart.js折线图中的Y轴上的标签中显示最后一个数据点值
- 17
获取用Chart.js渲染的折线图的y轴的最大值
- 18
d3.js如何绘制带有垂直x轴标签的折线图
- 19
[SOLVED] ApexCharts.js：如何在折线图中为轴标签设置固定值
- 20
nvd3库，如何自定义折线图
- 21
如何使用JavaScript中的自定义数据点和线型创建折线图
- 22
如何动态调整莫里斯折线图 y 轴
- 23
增加chart.js中折线图的标签大小
- 24
如何在Chart.js上自定义边框样式
- 25
如何在ggplot2中使用重复的x轴标签绘制折线图
- 26
如何使用Chart.js显示折线图数据集点标签？
- 27
如何在Google api折线图中禁用x轴和y轴线
- 28
Highcharts：如何在折线图的Y轴上设置第一个类别？
- 29
如何在双Y轴图中的ggvis中对齐条形图和折线图？
我来说两句