Html5canvas中如何用使用svg对象。_html/css_WEB-ITnose

在canvas中使用drawImage，吧svg对象作为参数传入，无法显示。不知道是不是drawImage不支持这个类型的对象参数。求解。。。

回复讨论(解决方案)

参见方法
http://code.google测试数据/p/canvg/
http://canvg.googlecode测试数据/svn/trunk/examples/index.htm

我贴一段代码给你：

test

svg, canvas { margin:1em }

FAIL


FAIL

var c = document.getElementById("c").getContext("2d"),
i = document.getElementById("i")
c.drawImage(i, 0, 0)




为什么canvas没有吧svg的图像画出来呢?如果画出来，怎么办呢（不用第三方的东西）？

其实我很想知道 drawImage 这个方法的第一个参数 可以接受的图像类型是什么 都有哪些？？

在支持svg的浏览器中进行测试，如Firefox16,Chrome

      test      svg, canvas { margin:1em }         
     FAIL         FAIL   
         window.onload = function () {          var ctx = document.getElementById("c").getContext('2d');          var svg_xml = (new XMLSerializer()).serializeToString(document.getElementById("i"));           var img = new Image();          img.src = "data:image/svg+xml;base64," + window.btoa(svg_xml);          img.onload = function () {              ctx.drawImage(img, 0, 0);          };      }       

其实我很想知道 drawImage 这个方法的第一个参数 可以接受的图像类型是什么 都有哪些？？

可以用HTMLImageElement，HTMLCanvasElement或者HTMLVideoElement作为参数

查看更多关于Html5canvas中如何用使用svg对象。_html/css_WEB-ITnose的详细内容...