antvis / X6

🚀 JavaScript diagramming library that uses SVG and HTML for rendering.
https://x6.antv.antgroup.com
MIT License
5.64k stars 1.69k forks source link

给rect添加文本,修改字体类型无效 #4032

Open shengaiyishi opened 10 months ago

shengaiyishi commented 10 months ago

问题描述

给rect添加文本,修改字体类型特别无效 我在 https://x6.antv.antgroup.com/examples/node/native-node#rect 上测试发现 事例: const a = graph.addNode({ x: 40, y: 40, width: 120, height: 60, // label: 'rect', attrs: { text: { text:'你好', // fontFamily: 'Times New Roman', fontFamily: '宋体', } } }) 当label为rect时,修改字体还是有效果的,当改成中文时,基本看不出效果了

重现链接

重现步骤

const a = graph.addNode({ x: 40, y: 40, width: 120, height: 60, // label: 'rect', attrs: { text: { text:'你好么', // fontFamily: '微软雅黑', // fontFamily: '黑体', } } }) 当文本是 rect时确实能看到效果,当文本为中文时,就看不到效果了

预期行为

期望修改字体类型有效果

平台

屏幕截图或视频(可选)

No response

补充说明(可选)

No response

XueMeijing commented 9 months ago

某些字体可能没有中文字形文件,导致切换无效,另外 微软雅黑 应该叫 Microsoft YaHei 吧 (https://www.jianshu.com/p/053e588c9470

如果你期望修改字体类型有效果,左边选中某个html的汉字,再修改css里这个汉字对应的font-family,看哪个font-family对汉字生效,然后再把配置的 fontFamily 改成有效的font-family。比如mac上 fontFamily: 'cursive' 就是有效的

image

shengaiyishi commented 9 months ago

是的,目前我采用的就是直接去遍历tspan,然后给它们添加font-family;

image