对于长日期字符串,如何在轴下方增加 space?
How can I increase space below axis for long date strings?
请查看图片,让我知道是否可以增加此图片的 margin/border 以适应长 date/time 字符串。
真的很抱歉。使用 Margin/Border 我们不能做任何事情,因为我们有很多 data.Already 我们在该图像中有很多 xAxis 标签。
我们可以为此做一件事。你为什么不能试试这种图表
https://ecomfe.github.io/echarts-examples/public/editor.html?c=candlestick-brush
在图表底部,它将具有更改 xAxis 范围的句柄。
希望您喜欢这个解决方案。
你可以设置grid
选项来达到这个目的:
grid.containLabel = true
喜欢的话还可以设置:
grid.bottom = 0
例如:
option = {
xAxis: {
type: 'category',
axisLabel: {
interval: 1,
rotate: 45
},
data: ['2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04']
},
yAxis: {
type: 'value'
},
grid: {
bottom: 0,
containLabel: true
},
series: [{
data: [820, 932, 901, 934, 1290, 1330, 1320, 820, 932, 901, 934, 1290, 1330, 1320, 820, 932, 901, 934, 1290, 1330, 1320, 820, 932, 901, 934, 1290, 1330, 1320,820, 932, 901, 934, 1290, 1330, 1320],
type: 'line',
smooth: true
}]
};
结果:
请查看图片,让我知道是否可以增加此图片的 margin/border 以适应长 date/time 字符串。
真的很抱歉。使用 Margin/Border 我们不能做任何事情,因为我们有很多 data.Already 我们在该图像中有很多 xAxis 标签。
我们可以为此做一件事。你为什么不能试试这种图表
https://ecomfe.github.io/echarts-examples/public/editor.html?c=candlestick-brush
在图表底部,它将具有更改 xAxis 范围的句柄。
希望您喜欢这个解决方案。
你可以设置grid
选项来达到这个目的:
grid.containLabel = true
喜欢的话还可以设置:
grid.bottom = 0
例如:
option = {
xAxis: {
type: 'category',
axisLabel: {
interval: 1,
rotate: 45
},
data: ['2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04', '2018-06-07 14:27:04']
},
yAxis: {
type: 'value'
},
grid: {
bottom: 0,
containLabel: true
},
series: [{
data: [820, 932, 901, 934, 1290, 1330, 1320, 820, 932, 901, 934, 1290, 1330, 1320, 820, 932, 901, 934, 1290, 1330, 1320, 820, 932, 901, 934, 1290, 1330, 1320,820, 932, 901, 934, 1290, 1330, 1320],
type: 'line',
smooth: true
}]
};
结果: