Use SVG Image for Advanced Site Interaction

LiamHarrington-Missin

Hi,

In his excellent article "Using the image-map appearance in Survey123" BrettStokes provides guidance on how to include an SVG image to create a more intuative method of submitting data.

Thinking about how Hub sites are created etc. is it possible to use an SVG in a similar manner but to allow for a more creative way of navigating or interacting with a site.

Thanks for reading.

Emily_Nilson · ‎08-15-2023

Hi @LiamHarrington-Missin , this is an interesting idea. Could you please elaborate further on how you would anticipate using an SVG image to navigate or interact with the site?

LiamHarrington-Missin · ‎08-15-2023

Hi @Emily_Nilson

In my simple mind, the use case would be something that could replace navigation links as I said. As an example, I have a concept where we would deliver a hub site to give our community access to resources relating to different aspects of an oil spill resposne.

There are many topics that I would like to link to. The default method to navigate would be from a menu/nav bar or something embedded into the site but there are a lot of topics and it may get crowded. However, an alternative that may deliver a cleaner experience could be to use a well established graphic and click on an area of the graphic that relates to topic of interest. In this case, clicking on the Surveillance, Modelling and Vis (SMV) area would navigate you to the SMV home page.

However, I could see it being used to interact with S123 or url parameters to give some cool interactions.

Emily_Nilson · ‎08-15-2023

This additional context is helpful - thanks so much, @LiamHarrington-Missin .