Chargement et affichage du svg

Comment charger un fichier .svg dans une page fabricjs.html?Chargement et affichage du svg

mon tissu fiddle tente de charger un fichier .svg http, mais j'ai, bien sûr, essayé des versions locales. J'ai utilisé des fichiers .svg générés à partir d'adobe illustrator et du tissu lui-même.

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(); 
         });

Source

2013-03-08 dsdsdsdsd

Voici comment charger SVG à partir d'un .svg externe

code est ici (assurez-vous d'un lien vers votre propre fabricJS .js):

<!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>

Source

2013-03-10 02:24:30 markE

__new fabric.Group (groupe) __ semble être ce qui me manquait ... merci – dsdsdsdsd

Chargement et affichage du svg

Répondre

Questions connexes