Skip to content

Embed a customizable Google Map in your Qualtrics survey to collect location data

Notifications You must be signed in to change notification settings

ncsg/qualtrics-google-map-lat-long

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

54 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Qualtrics Google Map Lat/Long Collector

NOTE

To use the updated code, you must replace it in all questions in your survey. If an older version of the code is running in another question, the map may not display.

Getting Started

Create or open a Qualtrics survey. You must be able to add JavaScript to a question for this code to work (it will not work on trial accounts where this feature is unavailable).

Header Script

The first step is to add the Google Maps API and this script to your survey's header. See Adding a Survey Header/Footer on Qualtrics' support site. When you get to the Rich Text Editor, click the Source Dialog icon in the toolbar to display HTML. Paste the following at the top of the header:

<script src="https://maps.googleapis.com/maps/api/js?libraries=places&key={YOURKEYHERE}"></script>

Make sure to replace the {YOURKEYHERE} with your Google Maps API key.

Making a Lat/Long Collection Question

Start by making a new Text Entry question. You can treat this question like you would any other (ex. require a response, change the title, etc.). It is recommended that you provide instructions in the question (see Using the Question below).

On the left side of the question, click the gear and select Add JavaScript...

Select everything in the box and clear it. The JavaScript box should be empty before pasting the code.

Copy the JavaScript from the file and paste it in the box.

At the top of the pasted code, find the section labeled Enter your Google Map API key in this variable.

Replace the text Your Key with your own API key (see the Google Maps documentation Get API Key).

Scroll down to the section labeled Variables and edit the variables as needed.

Click Save. Test the question before sending out the survey.

Using the Question

By default, an autocomplete field is created to assist in finding a location. Responders can enter a location into this field and the map will snap its marker to that location. They can then fine-tune the response by dragging the marker to a specific location (such as a door to a building).

If you would like to disable the autocomplete field, set the variable enableAutocompleteField to false. Users can then just drag the pin to the desired location.

The result is collected in the Qualtrics question field as a JSON object. It will be in the format as follows:

{"lat": "38.8951", "long": "-77.0364"}

About

Embed a customizable Google Map in your Qualtrics survey to collect location data

Resources

Stars

Watchers

Forks

Packages

No packages published

Languages

  • TypeScript 100.0%