起因

实现对 label 的样式定制，自定义字体颜色、大小等属性；效果如下图

实现

1. itemStyle: {
2. normal: {
3. color: '#f7ba0e',
4. label: {
5. show: true,
6. position: 'top',
7. formatter: function(params) {
8. for (var i = 0,
9. l = option.xAxis[0].data.length; i < l; i++) {
10. if (option.xAxis[0].data[i] == params.name) {
11. var val1 = params.value || 0;
12. var val2 = option.series[0].data[i] || 0;
13. return '{color1|' + val1 + '}/{color2|' + val2 + '}';
14. }
15. }
16. },
17. rich: {
18. color1: {
19. color: '#f7ba0e'
20. },
21. color2: {
22. color: '#42a1fe'
23. }
24. },
25. textStyle: {
26. color: '#333'
27. }
28. }
29. }
30. }

（1）通过“formatter”实现内容自定义；

'{color1|' + val1 + '}/{color2|' + val2 + '}' 用“color1”的样式显示“val1”，用“color2”的样式显示val2；

（3）下方有对“color1”和“color2”样式的具体定义；

官方文档

--------------------- 本文来自 lufaxinT 的CSDN 博客 ，全文地址请点击：https://blog.csdn.net/tomorrow13210073213/article/details/79654892?utm_source=copy