2 Stimmen

Raphael kumulativ vs. absolut skalieren/rotieren/umrechnen?

Ich versuche, eine interaktive Karte in Javascript zu zeichnen, und benutze Raphael, um die schwere Arbeit zu erledigen.

Der Kartenhintergrund ist ein ziemlich kompliziertes Gebilde, das ein Gitter, die Kartenelemente, Beschriftungen usw. enthält. Darüber hinaus zeichne ich dann die Dinge, mit denen der Benutzer tatsächlich arbeitet. Da der Hintergrund komplex ist, möchte ich ihn nicht bei jedem Frame neu rendern müssen. Nachdem ich ihn gezeichnet habe, möchte ich diese Zeichenelemente wiederverwenden und lediglich die Verschiebung, Drehung und Skalierung des Hintergrunds ändern, wenn der Benutzer schwenkt, zoomt, usw.

Leider verwirren mich die Transformationsprimitive von Raphael ziemlich: Sie verhalten sich nicht so, wie ich es erwarten würde. Wenn ich aufrufe scale() scheint sich die Skalierung auf die ursprüngliche Größe des Zeichenelements zu beziehen, aber translate() ist kumulativ, d.h. sie gilt für die vorherige Übersetzung. rotate() kann beides sein, denn es gibt eine Option, die ich einstellen kann...

Ist es möglich, eine absolute Übersetzung vorzunehmen? Das heißt, um in der Lage sein, die absoluten Koordinaten des neuen Mittelpunkts meiner Objekte (die in der Regel Pfade sind) angeben? Wenn das nicht möglich ist, ist es dann sinnvoll, die alte Position zu speichern, damit ich ein Delta anwenden kann, wenn ich das Objekt an die neue Position verschieben möchte?

Oder wäre es besser, wenn ich das Ganze einfach für jedes Bild neu rendern würde? (Ich sehe Vorschläge, dass Raphael nicht gut bei Transformationen von komplexen Zeichnungen ist, da das meiste in Javascript gemacht wird; wenn ich mir das SVG ansehe, das erzeugt wird, sehe ich, dass die Übersetzung in die Pfaddaten zurückgesichert zu werden scheint, was dies bestätigen würde...)

(BTW, FWIW ich bin mit der GWT Raphael-Schnittstelle für all dies.)

1voto

Rafa de Castro Punkte 2474

Sie können verwenden Element.attr um absolute Positionen festzulegen. Ändern Sie einfach die x- und y-Eigenschaften:

myElement.attr("x", myX);
myElement.attr("y", myY);

0voto

peteorpeter Punkte 3967

Ich habe das raphael-zpd-Plugin mit Erfolg verwendet. Ich bin nicht sicher, ob das in GWT einstecken wird - Sie könnten ihren Quellcode überprüfen und es für Ihren Anwendungsfall anpassen.

CodeJaeger.com

CodeJaeger ist eine Gemeinschaft für Programmierer, die täglich Hilfe erhalten..
Wir haben viele Inhalte, und Sie können auch Ihre eigenen Fragen stellen oder die Fragen anderer Leute lösen.

Powered by:

X