我已经有了解决我之前问题的方法(在Google地图上叠加SVG图表)。
但是我还有一个(较小的)问题。我正在使用Firefox 3.5和Safari 4(在Mac上),当我将SVG嵌入XHTML时,完全没有相同的结果。
我可以使用<object>
或<embedded>
元素(但我认为后者已被弃用)。我使用它们就像这样:
<div id="map_canvas" style="width: 900px; height: 900px">
<object data="test.svg" width="100%" height="100%" type="image/svg+xml"/>
</div>
我的SVG图像在Firefox和Safari中的大小和比例不同。在我的SVG中,width
、height
和viewBox
已经定义。
有没有一种方法可以使所有浏览器都产生相同的结果(我不关心不支持SVG的IE...,所以“所有浏览器”至少指的是最新版本的Firefox、Opera和Safari)?也许我忘记定义什么了吗?
编辑:我还注意到使用<object>
标签时,SVG在Firefox中是透明的,但在Safari中不透明... :(
是否有一种“标准”的方式来包含SVG?
感谢您的帮助。
letter-spacing
属性。目前Firefox不支持该属性,请参见https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/letter-spacing#Usage_Note - Fabien Snauwaert