如何在javascript中为没有单位的svg设置字体大小
如何在javascript中为没有单位的svg设置字体大小
提问于 2018-06-08 10:11:10
我正在编辑plotly.js库源代码，使其具有可伸缩的图形，我设置了viewBox和preserveAspectRatio (plotly.js use d3库)，但如果不使用任何单位，则字体大小会出现问题--属性将更改为px。
我试过从控制台测试字体是否更改为没有使用以下内容的单元：
[...document.querySelectorAll('text')].forEach((text) => {
text.style.fontSize = text.style.fontSize.replace('px', '')
});但似乎如果你不使用单位，px是自动添加。
我还尝试使用rem单元，并在html上设置62.5%，其中原始字体大小除以10，但当我调整绘图大小时，它不会缩放。
还尝试了这个新的CSS类型化的OM API：
[...document.querySelectorAll('text')].forEach((text) => {
var size = +text.style.fontSize.replace('px', '');
text.attributeStyleMap.set('font-size', CSS.number(size))
});但有错误：
Failed to execute 'set' on 'StylePropertyMap': Invalid type for property有任何解决方案，字体大小没有单位设置从javascript，或其他方式成比例的文本？
回答 2
Stack Overflow用户
回答已采纳
发布于 2018-06-08 10:55:37
在SVG中，没有单元说明符与使用px相同。所以font-size: 10和font-size: 10px的意思是一样的。他们的行为也会一样。
我不知道为什么这个价值没有单位对你很重要。听起来就像你认为这就是为什么你的文本没有缩放。这不是原因。肯定还有别的事情发生。如果您需要帮助解决这个问题，那么在您的问题中添加一个MCVE。
Stack Overflow用户
发布于 2018-06-08 10:30:19
在svg中，每个样式属性都有相应的属性，因此可以使用：
d3.select('text').attr('font-size', 10);并且它将设置字体大小没有单位。情节仍然没有扩大，但这才是问题所在。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50758299
复制相关文章
相似问题
腾讯云开发者
