michael: svg - animation von objekt entfernen

hallo,

ich habe ein problem in svg. es ixistiert eine vielazhl von objekten, denen ich verschiedene animationen zuordnen möchte. im genauen sidn es räume eines gebäudes, die blinken sollen. dazu kann ich ein element <animate> nutzen.

mit der folgenden funktion sendata() wähle ich den index aus einem menü aus, dies ist die id der zimmernummer, die dann blinken soll:

function SendData() {
  var theSelIdx = document.form1.TheSel.options[document.form1.TheSel.options.selectedIndex].value;
  var theSelName = document.form1.TheSel.options[document.form1.TheSel.options.selectedIndex].text;
  //checken der Eingaben
  if (theSelIdx < 0) {
    alert(unescape("Keine Auswahl getroffen%21"));
  } else {
    document.cookie = "TheRoom = " + theSelIdx;
    document.cookie = "TheUser = " + theSelName;
    var TheSVGE = document.getElementById('TheHouse').getSVGDocument().getElementById(theSelIdx);
    var svgdoc = TheSVGE.getOwnerDocument();
    var ich = document.getElementById('TheHouse').getSVGDocument().getElementById('tempus');
    if (ich != null) {
      alert('object leider immernoch da');
      var theToDelMother = ich.getParentNode();
      theToDelMother.removeChild(ich);
    }
    anineu=svgdoc.createElement("animate");
    anineu.setAttribute("id","tempus");
    anineu.setAttribute("attributeName","fill-opacity");
    anineu.setAttribute("attributeType","CSS");
    anineu.setAttribute("begin","0s");
    anineu.setAttribute("dur","0.5s");
    anineu.setAttribute("fill","freeze");
    anineu.setAttribute("from","0.6");
    anineu.setAttribute("to","0.1");
    anineu.setAttribute("repeatCount","20");
    anineu.setAttribute("calcMode", "discrete");
    anineu.setAttribute("onend", "bla()");
    TheSVGE.appendChild(anineu);
  }
}

function bla() {
   alert('bla');
}

das funktionniert klasse, danach soll aber der user ein anderes zimmer auswählen, d.h. die animation soll gelöscht werden und an ein anderes objekt (raum) anhgehangen werden. das geht irgendwie nicht, denn ich bekomme die animation nicht mehr weg. nur beim ersten mal geht alles gut. dann dachte ich ich kann mit

anineu.setAttribute("onend", "bla()");

erreichen, daß am ende der animation die funktion bla() ausgeführt wird. aber irgendwie wird das ignoriert. aus disem grunde die lösung mit:

if (ich != null) {
      alert('object leider immernoch da');
      var theToDelMother = ich.getParentNode();
      theToDelMother.removeChild(ich);
    }

aber das geht irgendwie nicht so recht.

hoffe, mir kann jetzt jemand weiterhelfen, denn ich bin mit meinem svg-latein am ende... wie also kann ich die animation wieder entfernen und an einem anderen objekt anhängen...

michael

  1. Hallo,

    dann dachte ich ich kann mit

    anineu.setAttribute("onend", "bla()");

    erreichen, daß am ende der animation die funktion bla() ausgeführt wird. aber irgendwie wird das ignoriert.

    Prinzipiell funktioniert der Event-Handler onend bei Animationselementen (zumindest im ASV 3.0). Ich habe auch schon problemlos onclick mit Funktionsaufruf dynamisch auf die genannte Weise erzeugt.

    Versuche es mal alternativ so:

    anineu.onend=function(){bla()};

    MfG, Thomas

    --
    SVG - Learning By Coding
    http://www.datenverdrahten.de/svglbc/
    1. hallo thomas,... auf dich ist verlass... danke dir für das posting.

      obwohl deine antworten immer functionieren, diesmal geht es nicht. was mich eigentlich beschäftigt mich vielmehr das problem, warum ich das childelement <animate> nicht mehr loeschen kann...

      if (ich != null) {
            //alert('object still exist');
            alert(ich);
            var theToDelMother = ich.getParentNode();
            theToDelMother.removeChild(ich);
          }

      mach ich was falsch? hast du ein eigenes beispiel? oder gar eine lösung?

      gibt es ein alternative für das onend-attribut?

      liebe grüße
      michael

      1. Hallo,

        var theToDelMother = ich.getParentNode();
              theToDelMother.removeChild(ich);

        mach ich was falsch? hast du ein eigenes beispiel? oder gar eine lösung?

        Da Dein Code unvollstaendig ist, um ihn einfach zu testen, vermute ich nur, dass Du den falschen Elementknoten erwischt.

        Teste das mal mit alert(ich.getParentNode().tagName)

        gibt es ein alternative für das onend-attribut?

        Zur Reaktion auf das Ende einer Animation ist das IMHO ideal geeignet. Allerdings ist zu beachten, dass damit auf das Ende der gesamten Animation gewartet wird, also entsprechend dem Wert von repeatCount. Vielleicht hilft alternativ auch onrepeat.

        Ggf. mal den Code irgendwo lauffaehig ablegen.

        MfG, Thomas

        1. hallo thomas,

          entschuldige die späte antwort.

          hier kanns du dir die daten mal runterladen. es geht allerdings nur für einige räume. wenn du das dokument aufmachst wirst du es sehen...

          http://www.lra-kamenz.de/test/loeschen.zip

          deinen vorschlag habe ich probiert, hat aber nicths geholfen. dann habe ich funktion so geändert, das jedes animate-objekt eine eindeutige id bekommt (mit lfd. nummer) weil ich dachte, das vielleicht das loeschen und neu erzeugen zu schnell erfolgt... aber hat auch nichts gebracht. deshalb die alerts im beispiel...

          danke dir, dass du sie dir mal anschaust.

          michael

          1. Hallo,

            hier kanns du dir die daten mal runterladen. es geht allerdings nur für einige räume. wenn du das dokument aufmachst wirst du es sehen...

            Ich kann leider nicht nachvollziehen, was eigentlich passieren soll bzw. was nicht funktioniert.

            Einige Raeume werden meim MouseOver-Event weiß, die meisten anderen liefern Laufzeitfehler und den SVG-Code von > 400 KB kann auch ich nicht einfach mal so kontrollieren.

            Da das Problem doch sehr speziell ist, kannst Du mal per Mail etwas mehr Details schildern.

            MfG, Thomas