【发布时间】:2018-05-21 11:28:30
【问题描述】:
在其 id 中包含变音符号并由 use 元素引用的 SVG 元素将不会在 Chrome 63 中显示。
Chrome 62(和之前的版本)、Firefox 57 和 Edge 可以正确显示 SVG。
在 Chrome 63 中不显示 SVG 的示例:
<svg id="TextBoxA" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:ev="http://www.w3.org/2001/xml-events" version="1.1" viewBox="0 0 230 110" width="230" height="110" encoding="UTF-8" >
<defs>
<g id="ThisIsAnUmlautä">
<svg xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" width="230" height="110" version="1.1">
<path d="M0,0 h230 v110 l-230,0 z" fill="#444444"></path>
<path d="M3,3 h224 v104 l-224,0 z" fill="#d13d73"></path>
<text x="25" y="89" style="fill: #000000; stroke: none; font-size: 88px;">Aüöä</text>
</svg>
</g>
</defs>
<g>
<use href="#ThisIsAnUmlautä" opacity="1"></use>
</g>
</svg>
id 中没有变音符号的工作示例:
<svg id="TextBoxA" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:ev="http://www.w3.org/2001/xml-events" version="1.1" viewBox="0 0 230 110" width="230" height="110" encoding="UTF-8" >
<defs>
<g id="ThisIsAnUmlaut">
<svg xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" width="230" height="110" version="1.1">
<path d="M0,0 h230 v110 l-230,0 z" fill="#444444"></path>
<path d="M3,3 h224 v104 l-224,0 z" fill="#d13d73"></path>
<text x="25" y="89" style="fill: #000000; stroke: none; font-size: 88px;">Aüöä</text>
</svg>
</g>
</defs>
<g>
<use href="#ThisIsAnUmlaut" opacity="1"></use>
</g>
</svg>
错误报告:https://bugs.chromium.org/p/chromium/issues/detail?id=792848
问题
正如 cmets 中所指出的,更改的意图可能只能由 Chromium 开发人员之一来回答。
了解元音变音是否被允许作为 SVG id 会很有帮助(现在已在此处确认答案:ISO table(s) of valid characters for SVG ids)。
那么现在有人知道除了删除元音变音之外是否有解决这个问题的方法吗?
【问题讨论】:
-
@RobertLongson 我已经添加了具体问题
-
您需要 chrome 开发人员来回复错误报告,以确认它是否符合预期
标签: google-chrome svg chromium