echarts树状图 文本设置宽高溢出隐藏...
时间: 2023-08-09 11:12:31 浏览: 426
echarts,以中国为中心的世界地图world.js
5星 · 资源好评率100%
要设置echarts树状图中文本的宽高,并且实现溢出隐藏,可以通过以下步骤实现:
1. 在echarts的series中设置label的normal属性,例如:
```javascript
series: [
{
type: 'tree',
data: [...],
label: {
normal: {
show: true,
width: 100, // 设置标签宽度
height: 20, // 设置标签高度
overflow: 'hidden', // 设置溢出隐藏
}
},
...
}
]
```
2. 在label的formatter回调函数中添加css样式,例如:
```javascript
label: {
normal: {
show: true,
width: 100,
height: 20,
overflow: 'hidden',
formatter: function(params) {
return '<div style="width: 100px; height: 20px; overflow: hidden">' + params.name + '</div>';
}
}
}
```
这样就可以设置echarts树状图中的文本宽高,并且实现溢出隐藏。需要注意的是,这种方式会将文本内容包裹在一个div元素中,并且需要手动设置div的宽高和溢出隐藏属性,因此在设置label的width和height属性时需要保证其与div元素的宽高一致。
阅读全文