加载和显示svg

如何将.svg加载到fabricjs.html页面？加载和显示svg

我的布料fiddle试图加载一个http .svg文件，但我当然试过本地版本。我使用了Adobe Illustrator和Fabric自身生成的.svg文件。

fabric.loadSVGFromURL(gvs_svgSrc, 
         function (argo) 
         { //alert("load handler : " + argo) ; 
          // ... returns: #<fabric.Rect> 
          lvo_SVG = argo.set({ left: 250, top: 200, angle: 0 }); 
          lvo_SVG = argo.scale(0.25); 
          gvo_canvas.add(lvo_SVG); 
          gvo_canvas.renderAll(); 
         });

来源

2013-03-08 dsdsdsdsd

这里是你如何从外部.SVG

这里的代码（请确认您链接到您自己fabricJS .js文件）加载SVG：

<!doctype html> 
<html> 
<head> 
<link rel="stylesheet" type="text/css" media="all" href="css/reset.css" /> <!-- reset css --> 
<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script> 
<script type="text/javascript" src="fabric.min.js"></script> 

<style> 
    body{ background-color: ivory; } 
    canvas{border: 1px solid red; } 
</style> 

<script> 
    $(function(){ 

     var canvas = new fabric.Canvas('canvas'); 
     var group = []; 

     fabric.loadSVGFromURL("http://fabricjs.com/assets/1.svg",function(objects,options) { 

      var loadedObjects = new fabric.Group(group); 

      loadedObjects.set({ 
        left: 100, 
        top: 100, 
        width:175, 
        height:175 
      }); 

      canvas.add(loadedObjects); 
      canvas.renderAll(); 

     },function(item, object) { 
       object.set('id',item.getAttribute('id')); 
       group.push(object); 
     }); 


    }); // end $(function(){}); 
</script> 

</head> 

<body> 
    <canvas id="canvas" width="300" height="300"></canvas> 
</body> 
</html>

来源

2013-03-10 02:24:30 markE

__new fabric.Group（组）__似乎是我想念的东西......谢谢 – dsdsdsdsd 2013-03-10 19:03:21

加载和显示svg

回答

相关问题