WebKit vs Gecko - SVG Animations

Dieses Thema im Forum "Webentwicklung" wurde erstellt von Smokers, 1. Februar 2012 .

Schlagworte:
Status des Themas:
Es sind keine weiteren Antworten möglich.
  1. 1. Februar 2012
    Hey, hier nur eine kurze Frage falls das jemand weis,


    a) wisst ihr wo ich die Unterschiede zwischen den beiden Engines in bezug auf SVG kompatibilität finde?!

    b) folgendes snippent funktioniert in Chrome aber im FF nicht
    Code:
     <line x1="{position()*$width_one+$width_one_half}" y1="225" x2="{position()*$width_one+$width_one_half}" y2="225" stroke="black" stroke-width="{$width_one_half}" >
 <animate attributeName="y2" from="225" to="{225-$avg_days*2.5}" begin="0.25s" dur="0.5s" fill="freeze"/> 
 </line>
    in FF werden halt keine Linien gezeichnet.

    Gibt es eine Möglichkeit zu prüfen ob diese Funktion unterstützt wird?! (mal abgesehen von der Browserweiche per JS)

    c) ist das wirklich ein Fehler der Engine?! Denn unter SVG in Firefox | MDN steht das das <animation> Element eigentlich implementiert sein sollte
     
  3. 1. Februar 2012
    AW: WebKit vs Gecko - SVG Animations

    gibt dem animate-element mal noch das attribut attributeType="XML"
     
  4. 1. Februar 2012
    AW: WebKit vs Gecko - SVG Animations

    Jo das hatt ich auch schon probiert, bringt leider nichts :-/

    Habs auch gerade versucht mit :

    Code:
    <line x1="{20+position()*$width_one+$width_one_half}" y1="225" x2="{20+position()*$width_one+$width_one_half}" y2="225" stroke="black" stroke-width="{$width_one_half}" >
 <animate attributeName="y2" from="225" to="{225-$avg_days*2.5}" begin="0.25s" dur="0.5s" fill="freeze"/> 
 <set attributeName="y2" to="{225-$avg_days*2.5}" begin="0.5s" fill="freeze"/> 
</line>


    Hier mal n BSP Output
    Code:
    <g class="dia1_val">
 <line x1="34.5" y1="225" x2="34.5" y2="225" stroke="black" stroke-width="11.5">
 <set attributeName="y2" to="297.19565217391306" begin="0.5s" fill="freeze"/>
 <animate attributeType="XML" attributeName="y2" from="225" to="297.19565217391306" begin="0.25s" dur="0.5s" fill="freeze"/>
 </line>
 <text x="43" y="302.19565217391306" font-size="11.5px" fill="#666666" transform="rotate(90,31.5,302.19565217391306)" opacity="0">
 2011-01-01
 <animate attributeName="opacity" from="0" to="1" begin="0.25s" dur="0.5s" fill="freeze"/>
 </text>
 <line x1="57.5" y1="225" x2="57.5" y2="225" stroke="black" stroke-width="11.5">
 <set attributeName="y2" to="290.2604166666667" begin="0.5s" fill="freeze"/>
 <animate attributeType="XML" attributeName="y2" from="225" to="290.2604166666667" begin="0.25s" dur="0.5s" fill="freeze"/>
 </line>
 <text x="66" y="295.2604166666667" font-size="11.5px" fill="#666666" transform="rotate(90,54.5,295.2604166666667)" opacity="0">
 2011-01-02
 <animate attributeName="opacity" from="0" to="1" begin="0.25s" dur="0.5s" fill="freeze"/>
 </text>
</g>
     
  5. 2. Februar 2012
    AW: WebKit vs Gecko - SVG Animations

    Wird wohl nicht gehen, hab ne Browserweiche und die default values gesetzt, so wird es wenigstens im FF angezeigt, wenn auch nicht animiert.

    danke trotzdem ;-)
     
  6. Video Script

    Videos zum Themenbereich

    * gefundene Videos auf YouTube, anhand der Überschrift.