【求教】有没有办法让graph用roam缩放的时候，label的字体大小也能一起缩放

[muhm21cn]

One-line summary [问题简述]

想让graph在用roam缩放的时候，节点和边／连线的label文字的大小也能和跟随节点的大小一起缩放。现在label的文字大小不随着一起缩放，当图形缩到很小的时候，字显的很大甚至超出节点范围，不是很和谐 。研究了好久，依然不知道该如何设置，在此求教。谢谢！

Version & Environment [版本及环境]

• ECharts version [ECharts 版本]: 4.0.4
• Browser version [浏览器类型和版本]: chrome
• OS Version [操作系统类型和版本]: mac OS

Expected behaviour [期望结果]

graph用roam缩放的时候，label字体大小能跟随缩放。或则能够监听知道roam缩放的程度，当缩小到预设程度时候，可以关闭label的显示。

ECharts option [ECharts配置项]

option = {

}

Other comments [其他信息]

参考如下官方实例：
http://echarts.baidu.com/examples/editor.html?c=graph-simple

[bulabula001]

同问， 就是文字会和背景冲突，造成显示异常

[ys278099744]

同问

[PeterRock]

同问

[shaohk]

有解决方案了吗？同问！

[bald-newcomer]

同问，有没有解决方案

[PeterRock]

爬了源码，结果让人无奈。保持字体大小不变，只缩放图形，这个脑洞是v4版本在设计代码时候特做进去的特性，不好动，动就要开大刀子

[susiwen8]

@PeterRock #12261

[PeterRock]

@PeterRock #12261

Yes, @pissang之前也提到过

[iMyon]

提供一个思路：

1. 字体用百分比
2. 监听graph缩放事件，动态更新图表依附页面元素的font-size

不过有个问题，如果label是多行文字，缩放过程中行高不会跟着改变，导致重叠

[yuanzhou3118]

已通过graphRoam实现：

     // 鼠标滚轮监听放大缩小
     myECharts.on('graphRoam', function(e) {
        const option = that.echartsGraph.getOption(); // 获得当前option.series的zoom
        const textPercent = (option.series[0].zoom - 0.8) / 0.8; // 计算比例,我设置zoom的初始值是0.8
        option.series[0].label.fontSize = 9 + 9 * textPercent // 等比例计算fontSize
        that.echartsGraph.setOption(option); // setOption
      });

同理可以加在toolbox内的自定义的“放大”和“缩小”按钮上

希望可以帮助到其他同学 😝

[github-actions]

This issue has been automatically marked as stale because it did not have recent activity. It will be closed in 7 days if no further activity occurs. If you wish not to mark it as stale, please leave a comment in this issue.

[github-actions]

This issue has been automatically closed because it did not have recent activity. If this remains to be a problem with the latest version of Apache ECharts, please open a new issue and link this to it. Thanks!