echarts中X轴文本倾斜,echarts坐标轴显示不全
Echarts
2019-01-17 16:26:27
效果预览:
问题描述:折线图或柱状图X轴文本显示不全
解决方法:文本设置倾斜rotate
axisLabel: {
rotate:40//倾斜40度
},
上图事例完整代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="https://cdn.staticfile.org/echarts/4.2.0-rc.2/echarts.min.js"></script>
</head>
<body>
<div id="test" style="height: 500px;width: 100%;">
</div>
<script>
var BarBOX1 = echarts.init(document.getElementById("test"));
option = {
xAxis: {
type: 'category',
axisLabel: {
rotate:40//倾斜40度
},
data: ['六月初博客站', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
},
yAxis: {
type: 'value'
},
series: [{
data: [120, 90, 150, 80, 70, 110, 130],
type: 'bar'
}]
};
BarBOX1.setOption(option);
</script>
</body>
</html>
echarts中X轴文本倾斜,echarts坐标轴显示不全!
六月初字帖坊小程序
你想要的字帖模板及工具,这里都有!
877篇文章
2161人已阅读