Elemento <symbol> SVG

L'elemento <symbol> di SVG viene utilizzato per definire simboli riutilizzabili. A meno che non venga riferito da un elemento <use>, le forme annidate nel <symbol> non vengono visualizzate.

L'elemento symbol viene utilizzato per definire un oggetto modello grafico, che può essere esemplificato da un elemento <use>. L'elemento symbol ha un ruolo grafico nel ripetere più volte lo stesso documento, aggiungendo struttura e semantica. Un documento strutturato può essere rappresentato in modo più vivido, come in un discorso o in braille, migliorando l'accessibilità. Attenzione, un elemento symbol non viene visualizzato. Solo l'esempio dell'elemento symbol (cioè, un elemento <use> che fa riferimento a un symbol) può essere visualizzato.

Esempio di simbolo

Questo è un esempio di simbolo symbol semplice:

<svg width="500" height="100">
　　　　<symbol id="shape2">
　　　　　　　　<circle cx="25" cy="25" r="25" />
　　　　</symbol>
　　　　<use xlink:href="#shape2" x="50" y="25" />
</svg>

L'elemento <symbol> necessita di un id per essere riferito dall'elemento <use>.

reserveAspectRatio e viewBox

L'elemento <symbol> può avere le proprietà prepareAspectRatio e viewBox. 　L'elemento <g> non può avere queste due proprietà. Quindi, rispetto all'uso dell'elemento <g> all'interno dell'elemento <defs>, l'elemento <symbol> potrebbe essere un metodo migliore per riutilizzare le forme.