2012-05-22 15 views
5

Załóżmy, że mam SVG owada. O ile nie jest to inaczej niemożliwe w ten sposób, chcę wstawić je jako znaczniki <img /> lub <object />.Kontrolowanie SMIL w SVG za pomocą JavaScript

Teraz insect.svg ma dwie animacje: jedną do chodzenia i drugą do latania.

Chciałbym rozpocząć/zatrzymać animacje, indywidualnie i od JavaScript JavaScript HTML (lub w inny sposób wywołać funkcję osadzania SVG JS "chodzić" lub "latać", z HTML JavaScript).

Ostatecznie, jeśli podczas gry chcę, aby mój owad latał, mogę po prostu poinformować go, że zrobię to za pomocą JS i powiedzieć, żeby przestał, kiedy nie powinien już latać. To samo dotyczy chodzenia.

Czy jest jakiś sposób to zrobić? Prowadziłem Google przez ostatnią godzinę i nie dokonałem prawdziwych ustaleń. Nie dbam o wsparcie IE, jeśli to jest problem.

Dziękuję za poświęcony czas!

Odpowiedz

1

Możesz spróbować użyć funkcji hiperłącze animacji SMIL. Umieszczasz identyfikator animacji, który chcesz uruchomić po # na adresie URL. Na przykład: http://www.w3.org/Graphics/SVG/Test/20061213/htmlObjectHarness/full-animate-elem-21-t.html - adres URL zmienia się po kliknięciu myszy i rozpoczyna animację. Jeśli używasz Firefoksa trzeba nocne jak SMIL odnośników nie jest w Firefox 12.

W przeciwnym razie, jeśli chcesz, aby uruchomić animację z javascript byłoby to coś takiego ...

var svgDocument = document.getElementById("objectId>").getSVGDocument(); 
svgDocument.getElementById('<animationElementId>').beginElement(); 

Ale to nie zadziała z elementem <img>, ponieważ nie pozwala na wykonywanie skryptów.

+0

getSVGDocument, sweet. Więc, żeby było jasne, jedynym sposobem na interakcję z SVG DOM jest osadzenie kodu SVG w HTML, prawda? – ArtPulse

+0

Wcale nie, powyższa odpowiedź zakłada, że ​​użyłeś zgodnie z życzeniem. –

+0

Och, idealnie wtedy. Dziękuję za pomoc. – ArtPulse

Powiązane problemy