paper.js Strichzeichnung inkonsistent

Question

Ich habe Probleme, dieses Problem nicht nur zu beheben, sondern es auch zu reproduzieren. Ich habe eine Web-App mit viel los, aber das Problem, das ich mit paper.js habe ist, dass manchmal der Strich viel zu groß ziehen wird. Hier ist, wie es aussehen sollte:

Aber es zieht wie folgt aus:

Wer noch keine Anhaltspunkte haben, wie dies geschehen könnte? Es erscheint nur zeitweise. Vielen Dank!

EDIT:

Ich habe herausgefunden, dass das Problem herkommt, daß ich meine <canvas> Element dynamisch Größe des Bildschirms auf Belastung mit jQuery passen. Ich habe jetzt ein Ereignis hinzugefügt, das die Höhe und Breite an mein Paperscript weitergibt, aber es funktioniert immer noch nicht. Wird die Lösung veröffentlichen, sobald ich sie habe.

Answer 1

Das Problem liegt darin, dass die Zeichenfläche vor der Übernahme von PaperScript nicht skaliert wird, sodass eine kleine Zeichenfläche erstellt wird, die dann für das Element skaliert wird.

Die Lösung besteht darin, das Timing der PaperScript-Auslastung zu bearbeiten. Ich es fest von meinem Laden Code zu modifizieren, wie so (verkürzt und "para-coded" der Kürze halber):

$(document).ready(function() { // wait for elements to propagate 
    $.get(...) // load html for text from external files 
    .then($('images').waitForImages() // wait for images to load 
     .then(function() { 
     resizeCanvas(); // make the canvas the correct size 

     $.getScript(paper_url, function() { // load paper.js dynamically 
      console.log("Paperjs is now loaded."); 
      paper.PaperScript.load(); // get paper.js to scan your application for paperscript 
     }); 

     // do everything else post load 
     }); 
    }); 
    }); 
}); 

Ich fand dies bei https://stackoverflow.com/a/14114337/1288913. Ich hoffe es hilft jemandem da draußen!