Chartjs轴的折线刻度标签文本

时间:2018-12-19 20:11:47

标签: chart.js chartjs-2.6.0

enter image description here

我正在尝试允许数据对象标签的空格中断。我已经仔细研究了Chartjs文档tick configuration上的配置选项,以允许换行或添加CSS类,以便在其中使用断字规则进行处理。

数据结构对象:

{
    labels: ["Arts Languages and Communication", "Science, Techology and Health", "Business", "Society and Education"],
    datasets: [{label: "Fall 2014", data: [0,0,0,0]}...]
}

选项对象:

{
    scales: {
        xAxes: [{ ticks: { /* no available options from docs */ } }]
    }
}

所需结果:

单词将在空格处断开

Arts Language
and Communication

1 个答案:

答案 0 :(得分:1)

如果您希望xAxis标签包裹文本,则需要以ViewModel

格式传递数据

所以在您的情况下-> labels: [['LONG', 'LONG', 'LONG', 'LABEL'], "Blue", ['YELLOW', 'LONG'], "Green Green", "Purple", "Orange"]

查看有效的演示:http://jsfiddle.net/Lzo5g01n/11/