Création d'un tampon de tampon/symbole dans paper.js

Question

J'essaie de créer un symbole à partir d'un .svg importé qui sera ensuite cloné en canvas sur chaque onmousemove. Le code ci-dessous clone le symbole une fois, puis déclenche une erreur.

Je suis nouveau sur javascript et paper.js, donc toute aide serait grandement appréciée!

function onMouseMove(event) { 
 
    
 
    var symbol = new Symbol(project.importSVG("../img/brush.svg")); 
 
     
 
    var clone = symbol.clone({ 
 
     center: event.middlePoint 
 
     }); 
 
}

Answer 1

Vous devez certainement créer le symbole en dehors de la fonction de gestion des événements, sinon le svg sera lu sur chaque événement de déplacement de la souris et un nouveau symbole sera créé à chaque fois. Et il n'y a pas besoin de cloner, simplement placer le symbole devrait fonctionner. Le snipplet suivant fonctionne (en utilisant un exemple de svg), mais il ne lit pas le svg du fichier.

var symbol = new Symbol(project.importSVG('<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><rect x="10" y="10" height="100" width="100" style="stroke:#ff0000; fill: #0000ff"/></svg>')); 

function onMouseMove(event) {  
    symbol.place(event.middlePoint); 
} 

Here is the Sketch for testing