Trabalhar com arquivos SVG

A configuração da aparência de uma pergunta selecionar um ou selecionar múltiplos para image-map, será apresentada como uma imagem com regiões selecionáveis da imagem como escolhas. Esta aparência exige um arquivo SVG para ser fornecido na pasta de mídia da pesquisa e os valores de nome da lista de opções para corresponder ao IDs do caminho das regiões do arquivo SVG. O nome de arquivo exato do arquivo de imagem (incluindo a extensão .svg) deve ser inserido na coluna media::image de sua planilha da pesquisa.

Aparência Image-map para selecionar um
Anotação:

image-map não é suportado no Survey123 web app.

Scalable Vector Graphics (SVG) é uma linguagem baseada em XML para gráficos vetoriais 2D. Você pode criar sua própria imagem de SVG utilizando um editor de gráficos vetoriais ou um editor de textos. Há também muitos sites da web oferecendo arquivos SVG gratuitos e ferramentas para converter imagens raster para o formato SVG. Um arquivo SVG pode incluir uma ou mais imagens raster no plano de fundo.

Um arquivo SVG pode ser modificado em um editor de textos. O exemplo seguinte mostra um arquivo SVG simples exibindo a orientação da bússola. Note os IDs do caminho de cada região.

<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>

Requisitos mínimos dos arquivos SVG

O seguinte são os requisitos mínimos de um arquivo SVG que pode ser utilizado com image-map no Survey123:

  • Deve conter pelo menos um elemento <path> que tem um valor id. Outros elementos como <rect>, <ellipse>, <circle>, <image> e <text> não pode ser utilizado para selecionar opções. Um elemento <path> não pode ser utilizado para selecionar opções se ele não tiver um valor de id.
  • Não pode conter grupos vazios. Os grupos são envolvidos pelas tags <g> e </g>. Se seu arquivo SVG contiver um ou mais grupos vazios, nenhuma das regiões da imagem serão selecionáveis.
  • Pode ter somente um grupo por nível agrupado. Seu arquivo SVG pode ter muitos níveis agrupados. Entretanto, se um nível tiver mais de um grupo, nenhum dos elementos <path> será selecionável.
  • Deve ter uma altura e largura definida (visor). Se seu arquivo SVG não tiver um visor, as regiões selecionáveis podem se tornar deslocadas da imagem subjacente.
  • Pode incluir um atributo viewBox opcional se ele corresponder à porta de visualização. Se o atributo viewBox diferir de seus valores de altura e largura, as regiões selecionáveis serão deslocadas da imagem subjacente.