Welcome to the LimeSurvey Community Forum

Ask the community, share ideas, and connect with other LimeSurvey users!

Ability to add Google Maps as a question

  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
10 years 1 month ago - 10 years 1 month ago #104986 by tpartner
Replied by tpartner on topic Ability to add Google Maps as a question
Well, I didn't have much time to spend on this but here's a quick-and-dirty example of how to calculate the distance and travel time from the "Default position" using the Google Maps API v3 Distance matrix .

Place this in the question source.
Code:
<script type="text/javascript" charset="utf-8">  
 
  $(document).ready(function(){
 
    // Identify the map
    var mapSGQA = '{SGQ}';
    var currentMap = gmaps[''+mapSGQA+'_c'];
 
    // Wait for the map to load
    google.maps.event.addListenerOnce(currentMap, 'idle', function(){ 
 
      // Some variable definitions
      var currentMarker = gmaps['marker__'+mapSGQA+'_c'];
      var answerInput = $('#answer'+mapSGQA+'_c');
      var defaultPosition = $(answerInput).val();
      var startLat = $('#answer'+mapSGQA+'_c').val().split(' ')[0];
      var startLng = $('#answer'+mapSGQA+'_c').val().split(' ')[1];
      var startLatLng = new google.maps.LatLng(startLat, startLng);
      var originIcon = 'https://chart.googleapis.com/chart?chst=d_map_pin_letter&amp;chld=O|FFFF00|000000';
 
 
      // Listener on the map events
      google.maps.event.addListener(currentMap, 'click', function() {
        calculateDistances(startLatLng, currentMarker.getPosition());
      });
      google.maps.event.addListener(currentMarker, 'dragend', function() {
        calculateDistances(startLatLng, currentMarker.getPosition());
      });
      google.maps.event.addListener(currentMap, 'rightclick', function() {
        calculateDistances(startLatLng, currentMarker.getPosition());
      });
 
      // Insert the results element
      $(answerInput).after('<div class="distanceResults" />');
 
    });
  });
 
  function calculateDistances(origin, destination) {
    var service = new google.maps.DistanceMatrixService();
    service.getDistanceMatrix({
      origins: [origin],
      destinations: [destination],
      travelMode: google.maps.TravelMode.DRIVING,
      unitSystem: google.maps.UnitSystem.METRIC,
      avoidHighways: false,
      avoidTolls: false
    }, callback);
  }
 
  function callback(response, status) {
    if (status != google.maps.DistanceMatrixStatus.OK) {
      alert('Error was: ' + status);
    } else {
      var origins = response.originAddresses;
      var destinations = response.destinationAddresses;
 
      var outputDiv = $('.questiontext');
      outputDiv.innerHTML = '';
 
      for (var i = 0; i < origins.length; i++) {
        var results = response.rows[i].elements;
        for (var j = 0; j < results.length; j++) {
          $('.distanceResults').html('Start address: '+origins[i]+'<br />\
                        End address: '+destinations[j]+'<br />\
                        Distance: '+results[j].distance.text+'<br />\
                        Time: '+results[j].duration.text+'');
        }
      }
    }
  }
</script>

Demo survey:

File Attachment:

File Name: travel_dis...e_v2.lss
File Size:15 KB








.

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Last edit: 10 years 1 month ago by tpartner.
The following user(s) said Thank You: dglp
The topic has been locked.
More
10 years 1 month ago #105001 by dweisser
Replied by dweisser on topic Ability to add Google Maps as a question
Hey T,
This is great. I think there are a lot of directions one could go here.

I was working on this, but instead of using the short-text Map-style question, I ended up showing a map inside a short-text text-style question. It is not optimal because the style requirements were pretty hard to work with, however I was able to save the calculated distance as the question's answer.

I assume that this is what this does:
Code:
// Insert the results element
$(answerInput).after('<div class="distanceResults" />');

I suppose the "benefit" of using the external map rather than the short-text map-style question is that it might be more easy to implement driving directions, location search and things of that nature. Or is it?

Your solution is really great. Thank you as always for relentlessly adding to the knowledge base.

David
The topic has been locked.
  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
10 years 1 month ago #105002 by tpartner
Replied by tpartner on topic Ability to add Google Maps as a question
Yes, of course, this could be applied to any map. I just used the LimeSurvey map because it was faster.



.

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The topic has been locked.
More
9 years 7 months ago #111398 by AudioMan612
Replied by AudioMan612 on topic Ability to add Google Maps as a question
Hi,

As some people have mentioned here, I would like a way to implement a search function in Google Maps in a survey. I have very limited experience with web development, so I'm struggling a bit with this (I'm used to writing stand-alone programs, not scripts for webpages). Anyways, I found a LimeSurvey that has successfully implemented a search function and I was wondering if anyone might have any clues as to how to implement this.

bart.etcsurvey.com/index.php/

The first question with Google Maps is somewhere around 7 questions in. The survey remembers your choice as the origin of you trip and shows it on a map later on. I'm currently going through the sources for the webpage trying to see if I get any ideas, but any help would be awesome. Thanks!
The topic has been locked.
More
9 years 4 months ago #113715 by s9521070
Replied by s9521070 on topic Ability to add Google Maps as a question
Did anyone find a way to include a "Place search box" inside a question that uses Google Maps? It would be really helpful if the functionality shown here can be used to obtain the latitude-longitude values from a Google Maps Limesurvey question without the necessity to move around the map manually.
The topic has been locked.
More
8 years 2 months ago #129629 by Maryam01
Replied by Maryam01 on topic Ability to add Google Maps as a question
Is there a way to add the google search bar in the version 2.06?
The topic has been locked.
  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
8 years 2 months ago #129633 by tpartner
Replied by tpartner on topic Ability to add Google Maps as a question
Can you explain more? Add a search bar to what?

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The topic has been locked.
More
8 years 2 months ago #129635 by Maryam01
Replied by Maryam01 on topic Ability to add Google Maps as a question
Thank you for your prompt reply.

What we mean is to have a search bar that will allow survey participant to enter their location and the map will show the specific location in google map.

Right now we use a short text question and enable the google map but the survey participant will need to drag the map to go to his/her location which consume a lot of time unlike if you have a search bar you will just type your address and your location will be display.

Thnaks a lot
Attachments:
The topic has been locked.
  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
8 years 2 months ago #129648 by tpartner
Replied by tpartner on topic Ability to add Google Maps as a question
LimeSurvey uses Google Maps API v3 so, as stated earlier in this thread, the Google Bar (search bar) doesn't exist. You will need to do the search with an AJAX call to the Google Places API - developers.google.com/places/?csw=1

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The topic has been locked.
More
8 years 1 month ago #130480 by dsvo
Replied by dsvo on topic Ability to add Google Maps as a question
hello, .i am trying to do a survey for my master thesis..

is it easy to explain me how to add a search box in a question with google maps so i can type my adress and my location be displayed..? i am new here and i dont have so much knowledge...
The topic has been locked.
More
8 years 1 week ago #132986 by mascarpone
Replied by mascarpone on topic Ability to add Google Maps as a question
Hi Folks, another request on this nice feature: anyway that users can enter (either type or copy/paste) their coordinates in the small text field as opposed to dragging the placemarker on the right spot?

Right it seems to be a display only (doesn't capture coordinates that are typed in) - would be very helpful, thanks!
The topic has been locked.
More
7 years 10 months ago #136361 by DiegoSilva
Replied by DiegoSilva on topic Ability to add Google Maps as a question
Do you know how to do it? I need to do the same....

Thanks in advance.-
The topic has been locked.

Lime-years ahead

Online-surveys for every purse and purpose