美文网首页
echarts图例中图标文字对齐

echarts图例中图标文字对齐

作者: 书中自有颜如玉__ | 来源:发表于2021-12-24 11:21 被阅读0次

    写这个笔记是因为这件看似很简单的小事,折磨了我很久。

    先上图 image.png 去官网示例中细看,发现全都是不对齐的,就想调整一下,翻了legend的配置,尝试设置textStyle没有解决 image.png
    然后看到富文本相关的介绍,想尝试使用,但是文档写得很含糊不清,你看了知道该怎么写嘛? image.png
    查了一圈好不容易才找到,formatter直接在legend下写,rich在legend.textStyle中。
            legend: {
              top: 5,
              left: 0,
              data: ['区块数', '目录上链数'],
              icon: 'circle',
              itemWidth: 8,
              itemHeight: 8,
              formatter: [
                '{a|{name}}'
              ].join('\n'),
              textStyle: {
                height: 8,
                rich: {
                  a: {
                    verticalAlign: 'bottom',
                  },
                }
              }
            },     
    
    OK,效果出来: 1640242216675_457B8CB1-1F24-425e-A7AA-8D3BB0DE4792.png

    希望能帮助到跟我一样无助徘徊的同学。

    相关文章

      网友评论

          本文标题:echarts图例中图标文字对齐

          本文链接:https://www.haomeiwen.com/subject/oorlqrtx.html