Jaccs
Jaccs

Reputation: 1072

How to get newline after the title in echarts line chart?

I would like to add new line after the title, can anyone help me how to i do that? Here i'm setting options like,

option ={
title: 'test content regarding the line chart'
}

Due to title is long, it is coming on top of legends tried like,

option ={
title: 'test content regarding the line chart \n'
}

won't workout...

Thanks,

Upvotes: 2

Views: 6581

Answers (1)

Theotonio
Theotonio

Reputation: 228

You did it right. Just use the '\n' to add another line and you can use the eChart editor online to test it. Pay attention on the subtext position when you change the title inserting or removing the new line at the end of the title.

https://ecomfe.github.io/echarts-examples/public/editor.html

You can use this example:

option = {
title: {
    text: ' Inserting a break on title \n and another break here \n',
    subtext: 'We also have the subtext'
},
tooltip: {
    trigger: 'axis',
    axisPointer: {
        type: 'shadow'
    }
},
legend: {
    data: ['Production']
},
grid: {
    containLabel: true
},
xAxis: {
    type: 'value',
    data: ['abc','xyz'],
    boundaryGap: [0, 0.01]
},
yAxis: {
    type: 'category',
    data: ['Month 1','Month 2']
},
series: {
        name: 'Production',
        type: 'bar',
        data: [70,80],
        isBiggerOrEqual: true
    }};

Upvotes: 3

Related Questions