怎么用svg 浏览器兼容性打开svg

来源：蜘蛛抓取(WebSpider) 时间：2016-12-30 12:25 标签： svg浏览器兼容
为啥chrome使用svg技术，没法正常使用getSVGDocument这个方法 - 开源中国社区
当前访客身份：游客 [
当前位置：
在谷歌浏览器调用这个方法，就提示获取的东西为null，但是在IE下是可以的。。。
有人说是文件格式打开的原因，但是我试了把相关的html和svg部署到web容器上也是没法正常
相应的解决方案如下，但是对于我并不适合，求有没有和我一样情况的，帮我说说啥情况，谢谢各位大侠
http://blog.csdn.net/xiaochangwei789/article/details/7823455
/p/chromium/issues/detail?id=21338
我是在html中嵌入svg的，主要代码如下：
//需要获取当前SVG图像的DOM var svgDoc= function initHtml(){ var svgEle = document.getElementById(&testSVG&); svgDoc = svgEle.getSVGDocument();//获得svg的document对象
alert(svgDoc);
var rect = svgDoc.getElementById(&rect&);//这个是svg文档中的一个元素的id,了解svg会懂的，就是这句报错
&body onload=&initHtml()&& &div style=&position:text-align:z-index:100&& &embed id=&testSVG& name=&testSVG& src=&test.svg& width=&1024& height=&768& type=&image/svg+xml& pluginspage=&/svg/viewer/install/& /&
然后通过调试工具,提示“cannot call method getElementById”，其实实际上是前面的那个svgDoc获得的值是null引起的，不过在ie下，svgDoc 通过alert出来是有值的，但是在chrome下不行。这个写法应该是通用写法，也怀疑过是svg文档没有加载完成就调用了getSVGDocument方法，所有我也试了把js代码块放到了body后边，先让页面加载然后再调用js代码，但还是一样的问题，求解啊，各位大侠
共有2个答案
<span class="a_vote_num" id="a_vote_num_
我也遇到了这个问题，请问你解决了嘛？
<span class="a_vote_num" id="a_vote_num_
1. 先获取页面元素
①doc=document.getElementById("doc");
2. 获取svg对象
①svg=doc.getSVGDocument();
3. 获取svg文档对象
①svgDoc=svg.documentE
4. 获取svg文档对象节点
circle=svgDoc.getElementsByTagName("circle")[0];
更多开发者职位上
有什么技术问题吗？
594zzb...的其它问题
类似的话题8个实用的SVG工具
8个实用的SVG工具
来源： | 时间： 09:59:08 | 阅读数：
[导读] 你还在为没有好用的SVG工具而发愁吗？开发人员的福音来啦！小编为大家收集罗列了8款实用的SVG工具，让我们一起来看看吧！
&&&&&& SVG可缩放矢量图形（Scalable Vector Graphics）是基于可扩展标记语言（XML），用于描述二维矢量图形的一种图形格式。SVG是W3C在2000年8月制定的一种新的二维矢量图形格式，也是规范中的网络矢量图形标准。SVG严格遵从XML语法，并用文本格式的描述性语言来描述图像内容，因此是一种和图像分辨率无关的矢量图形格式。
&&&&&& 鉴于近几年SVG迅猛的发展，小编为大家介绍几款实用的SVG工具，帮助你的。
SVG Circus
&&&&&& SVG Circus能够帮助你在几秒之内创建很酷的SVG spinners、加载器和其他循环动画。你也可以改变诸如起点、动画的路径等等，同时也提出了许多可供选择的技巧。
&&&&&& Snap.svg是专为现代浏览器设计的，它支持屏蔽、剪裁、完整渐变等新的SVG功能。
&&&&&& 尽管支持SVG的众多优秀的浏览器日益普及，但是却缺乏良好的矢量图标方法，而作为SVG的iconmelon工具及时地填补了这一空白，使用它作为Web项目的矢量图标着实是一个不错的选择。
Plain Pattern
&&&&&&&&&&
&&&&&& 这是个人觉得非常值得推荐给大家的一个工具，在Plain Pattern的网站上，你能够根据你所选择的颜色快速地生成SVG图形，这可能比任何手写的形式都要快！
Highcharts
&&&&&&&&&&&&
&&&&&& Highcharts是一个用纯JavaScript编写的图表库，它提供在你网站或者Web应用程序当中添加交互式图表的简单方法。Highcharts目前支持散点图、条形图等。
&&&&&&&&&&&&&&&&
&&&&&& 这是一个非常神奇的SVG工具，它能够带你玩转所有类型的字体以及图标。你可以针对不同目的的字体和图标进行细节修改，让其更具吸引力。
&&&&&&&&&&&&&&&&&&
&&&&&& Paths.js可以帮助生成SVG路径的高水平API。这些路径的API可以使用同一个模板引擎，用来在浏览器中显示SVG图形。
&&&&&&&&&&&&&&&&&&&&&&
&&&&&& 一个轻量级的操作库和SVG动画。你不会找到一个库，比它的体积更小更简洁。同时我还发现svg.js提供了一些增强体验功能的插件，它允许你修改过滤器的图片和你正在构建的图标。
手机扫描下方二维码，关注php100官方微信。
同步官网每日更新，为您带来随时随地的资讯与技术信息。更有不定期的互动抽奖活动，赢取实用贴心的小礼物。
除非特别声明，PHP100新闻均为原创或投稿报道，转载请注明作者及原文链接原文地址：
haowubai&&
友情链接与合作伙伴
粤ICP备号-3you have been blocked

我要回帖

更多关于 svg浏览器兼容 的文章

 

随机推荐