Nullpunktverschiebung
  • mimuel1955 September 2017
    Hallo,
    ich experimentiere mit SVG-Animationen (d3 transition) - das klappt ganz gut aber ein Problem bekomme ich nicht gelöst und das ist eigentlich sehr simple.
    Inksacpe legt standardmäßig den Nullpunkt nach unten links. Bei Animationen mit Rotation möchte ich den Nullpunkt aber möglicht in der Rotationsachse haben, das vereinfacht die Vorgehensweise erheblich. Verschiebe ich in Inkscape das SVG-Objekt mit der Rotationsachse nach x0 y0, dann erscheint nur die Grafik im positiven X- und Y-Bereich. "Ändern der Seitengröße" mit entsprechender Randeinstellung führt auch nicht zum Erfolg. Meine konkrete Frage: Wie kann ich den Nullpunkt ins Objekt verschieben, und trotzdem im Browser wenn ich das Objekt verschiebe alles angezeigt bekommen?
    Danke 
    Gruß Michael
  • Moini September 2017
    Ich gehe mal davon aus, dass man in d3.js (richtig?) das Rotationszentrum frei festlegen kann, und würde Dir empfehlen, das zu tun.

    Die Seitenausdehnung ist in SVG durch die viewbox definiert. Die lässt sich per Javascript sicher auch anpassen.

    Der 'Nullpunkt' in Inkscape ist eine rein optische Sache, die nur innerhalb von Inkscape für die Anzeige relevant ist.
    Der befindet sich in Browsern und im SVG-Code dem Standard entsprechend oben links.
  • mimuel1955 September 2017
    Hallo Moini,
    danke für deine Antwort.
    Ja - ich kann das Rotationszentrum in d3.js frei definieren - aber wenn sich ein Objekt exzentrisch drehen soll, ist das eine richtige Herausforderung.
    Die Manipulation der SVG-Datei ist auch keine gute Lösung.
    Schade - ich wollte eine einfache Lösung indem ich in einer Json-Datei Animationen definiere und mit d3 diese interpretiere und im Browser darstelle. Dann wirds halt konplizierter.
    Gruß Michael


  • Moini September 2017
    Hast Du schon mal einen Blick auf Sozi geworfen? http://sozi.baierouge.fr/  - für einige Animationsarten (Slideshows mit bewegten Ebenen) ist das auch sehr gut geeignet. Rotationszentren frei wählbar.

    Du kannst schon auch in Inkscape Rotationszentren definieren, Inkscape hat allerdings ein eigenes Format dafür (siehst Du im XML-Editor, wenn Du das Drehzentrum eines Objektes verschiebst). Den könntest Du evtl. mit Javascript ansteuern und seine Lage so graphisch bestimmen. Achtung, der Punkt ist nur im jeweilig gültigen Koordinatensystem des Objektes korrekt (Stichwort: 'transform' und 'scale' Attribute).

Hey Fremder!

Sieht so aus als wenn du neu hier bist. Wenn du mitmachen willst, drücke einen dieser Buttons!

In dieser Diskussion