我有一些 SVG 文本在 Firefox 上运行良好,但在 Chrome 和 Safari 中却没有出现。
我努力了:
- 向 svg 容器添加填充,以防文本被
隔断,
- 从文本中删除 [xml:space="preserve'],
- 添加内联填充颜色。
<svg class="fraction_spinner" width="64" height="64" version="1.1" xmlns="http://www.w3.org/2000/svg">
<circle id="CS1_01-intro" cx="32" cy="32" r="25" fill="transparent"/>
<text class="spinner-text spinner-text__casestudy" xml:space="preserve">
<textPath xlink:href="#CS1_01-intro">Longform case study</textPath>
</text>
</svg>
我希望文本能够像在 Firefox 中一样呈现,但在 Chrome 和 Safari 中却无济于事
SVG 2 规范的增强功能之一是 textPath 元素不再只需要指向路径元素。他们现在应该能够指向任何形状 https://www.w3.org/TR/SVG2/text.html#TextPathElement。 Firefox 已经实现了 SVG 2 规范的这一部分,其他浏览器还没有这样做。
公平地说,SVG 2 的某些部分其他浏览器已实现,而 Firefox 尚未实现。
You can 使用路径画一个圆 https://stackoverflow.com/questions/5737975/circle-drawing-with-svgs-arc-path相反,它适用于所有浏览器。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)