Wie ändert man das Argument von Svg g transform = scale (X) mit JavaScript?

8

Hey.
Sagen wir, irgendwo auf meiner Seite habe ich SVG-Grafiken. Es gibt eine Gruppe, die ich neu skalieren möchte, wenn ein Ereignis ausgelöst wird. Wie mache ich das?
Beispielcode:

%Vor%

Ich möchte das Argument scale (13) ändern, um das zu tun, was in der Funktion getScreenSize (evt) {...} sein sollte? Oder wie erzielen Sie einen ähnlichen Effekt auf andere Weise?

bearbeiten
Was die allgemeine Idee betrifft, möchte ich die Grafikgröße ändern, ohne feste Werte irgendwo anzugeben. Also meine divs Größen sind prozentual, jetzt möchte ich nur meine Grafik genau zu meinem div passen, unabhängig von seiner Größe. Deshalb habe ich daran gedacht, dass JS das scale () - Argument ändert, wenn das Ereignis ausgelöst wird (div resize). Die Funktion würde in die Skalarargumentberechnung von DivSize / rectBaseSize (x oder y) einfügen.

    
yoosiba 18.01.2011, 01:20
quelle

2 Antworten

13

Fügen Sie dem <g> ein ID-Attribut hinzu und versuchen Sie Folgendes:

%Vor%

oder alternativ:

%Vor%

Warum benutzen Sie nicht einfach eine viewBox, um den SVG-Inhalt automatisch neu skalieren zu lassen? Oder gibt es bestimmte Einschränkungen für das, was gezeigt werden sollte? Es ist auch möglich, einige davon mit nicht geskripteten Lösungen basierend auf CSS3 Medien-Abfragen zu tun, siehe Ссылка (don Vergessen Sie nicht, die Beschreibung für Links zu den Demo-Dateien in dieser Präsentation zu überprüfen.

    
Erik Dahlström 18.01.2011, 08:03
quelle
1

Wenn Sie "nur" möchten, dass eine SVG auf die Größe eines DIV skaliert wird, können Sie das mit CSS tun

%Vor%     
Tvog 19.05.2013 04:36
quelle

Tags und Links