2012-12-27 20 views
10

In Google Chrome 24, se un elemento a cui fa riferimento un elemento <use> viene definito successivamente nel documento, non viene reso. Non ho notato nulla relativo all'ordine degli elementi nella documentazione per l'elemento use.L'ordine degli elementi è importante per SVG in linea?

Questo comportamento non è definito e non dovrebbe essere previsto che sia coerente tra i browser o solo un bug in Chrome?

Di seguito è riportato un esempio (leggermente modificato dalla domanda this). Il cerchio blu rende come previsto, rosso, non così tanto. Firefox 17 e IE 9 rendono entrambi i cerchi come mi sarei aspettato. Quando lo stesso contenuto è referenziato come esterno <img />, entrambi i cerchi vengono visualizzati anche.

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <title>Chrome use-tag bug?</title> 
</head> 
<body> 
    <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="200px" height="200px" viewBox="0 0 200 200"> 
     <defs> 
      <g id="test2"> 
       <circle cx="50" cy="50" r="25" fill="blue"/> 
      </g> 
     </defs> 

     <g> 
      <rect x="0.5" y="0.5" width="199" height="199" stroke="black" fill="none"/> 
      <use xlink:href="#test1" x="0" y="0"/> 
      <use xlink:href="#test2" x="0" y="0"/> 
     </g> 

     <defs> 
      <g id="test1"> 
       <circle cx="100" cy="100" r="25" fill="red"/> 
      </g> 
     </defs> 
    </svg> 
</body> 
</html> 

UPDATE: sembra funzionare in Chrome 39.

+0

_i penso_, l'ordine è importante, almeno le specifiche dicono che - http://www.w3.org/TR/SVG/render.html#RenderingOrder - così hai, _probabilmente_, esegui ancora un altro bug del webkit. – c69

+0

Per la pittura, hai assolutamente ragione, lo fanno. In questo caso sto solo facendo riferimento a un altro elemento (che in realtà non verrà dipinto). Non sei sicuro di dover dichiarare gli elementi prima di poterli usare (come i compilatori di vecchia scuola in cui puoi solo chiamare le funzioni che hai dichiarato). – R0MANARMY

+1

Sono d'accordo con te, questo deve essere un bug. Il meccanismo di riferimento 'xlink: href' ha purtroppo alcuni difetti in Webkit. –

risposta