Lavorare con file SVG

Impostando l'aspetto di una domanda select one o select multiple su image-map, la domanda viene presentata come immagine con regioni selezionabili dell'immagine come scelte. Questo aspetto richiede che sia fornito un file SVG nella supporto cartella del rilevamento e che i valori dei nomi dell'elenco di scelta corrispondano agli ID del percorso per le regioni del file SVG. Il nome file esatto del file di immagine (inclusa l'estensione .svg) deve essere immesso nella colonna media::image del foglio di lavoro del rilevamento.

Aspetto Image-map per select one
Nota:

image-map non è supportato nell'applicazione Web Survey123.

Scalable Vector Graphics (SVG) è un linguaggio basato su XML per la grafica vettoriale 2D. È possibile creare la propria immagine SVG personalizzata usando un editor di grafica vettoriale o un editor di testo. Esistono anche molti siti Web che offrono file SVG gratuiti e strumenti per convertire immagini raster in formato SVG. Un file SVG può includere una o più immagini raster in background.

Un file SVG può essere modificato in un editor di testo. L'esempio di seguito mostra un semplice file SVG che descrive le indicazioni della bussola. Annotare gli ID percorso per ogni regione.

<svg
  xmlns="http://www.w3.org/2000/svg"
  height="180"
  width="180">
  <g style="fill:#A9A9A9">
    <path id="North" d="M 75,75 90,0 105,75 Z"/>
    <path id="South" d="m 75,105 15,75 15,-75 Z"/>
    <path id="West" d="M 75,75 0,90 75,105 Z"/>
    <path id="East" d="m 105,75 75,15 -75,15 Z"/>
  </g>
</svg>

Requisiti minimi per i file SVG

Di seguito sono indicati i requisiti minimi per un file SVG che può essere utilizzato con image-map in Survey123:

  • Deve contenere almeno un elemento <path> con un valore id. Non è possibile utilizzare altri elementi quali <rect>, <ellipse>, <circle>, <image> e <text> per le selezioni. Non è possibile utilizzare un elemento <path> per le selezioni se non si dispone di un valore id.
  • Non può contenere gruppi vuoti. I gruppi sono racchiusi tra i tag <g> e </g>. Se il file SVG contiene uno o più gruppi vuoti, nessuna delle regioni dell'immagine sarà selezionabile.
  • Può disporre di un solo gruppo per livello nidificato. Il file SVG può avere molti livelli nidificati. Tuttavia, se un livello contiene più di un gruppo, nessuno degli elementi <path> sarà selezionabile.
  • Deve avere un'altezza e una larghezza definite (finestra). Se il file SVG non dispone di una finestra, le aree selezionabili potrebbero diventare sfalsate rispetto all'immagine sottostante.
  • Può includere un attributo viewBox facoltativo se corrisponde alla finestra. Se l'attributo viewBox differisce dai valori di altezza e larghezza, le regioni selezionabili verranno sfalsate rispetto all'immagine sottostante.

In questo argomento
  1. Requisiti minimi per i file SVG