AnsweredAssumed Answered

call  google api as a function in my search widget

Question asked by Henseki on Jul 9, 2017
Latest reply on Jul 26, 2017 by Henseki

Hi All,

 

Do not know if anyone has worked with Google places api or OSplaces api.all similar to Esri javascript api.

 

I would like to include Google search places api as a function or sources in my search widget code. Don't really know the best way to go about this though.

Google Api search function

https://developers.google.com/maps/documentation/javascript/examples/geocoding-simple

<script>
     
function initMap() {
       
var map = new google.maps.Map(document.getElementById('map'), {
          zoom
: 8,
          center
: {lat: -34.397, lng: 150.644}
       
});
       
var geocoder = new google.maps.Geocoder();

        document
.getElementById('submit').addEventListener('click', function() {
          geocodeAddress
(geocoder, map);
       
});
     
}

     
function geocodeAddress(geocoder, resultsMap) {
       
var address = document.getElementById('address').value;
        geocoder
.geocode({'address': address}, function(results, status) {
         
if (status === 'OK') {
            resultsMap
.setCenter(results[0].geometry.location);
           
var marker = new google.maps.Marker({
              map
: resultsMap,
              position
: results[0].geometry.location
           
});
         
} else {
            alert
('Geocode was not successful for the following reason: ' + status);
         
}
       
});
     
}
   
</script

 

 

 

 

 

I want the google search api to carry out the address searches when a user click on a search button to search a post code for example but I want the search result to be displaced on ESri map.

 

How do I include google api search to the searchWidget sample below

ESRI Search Widget( its also a geocoding service on its own)

<script>
    require([
      "esri/Map",
      "esri/views/SceneView",
      "esri/widgets/Search",
      "dojo/domReady!"
    ], function(
      Map,
      SceneView,
      Search) {
      var map = new Map({
        basemap: "satellite",
        ground: "world-elevation"
      });
      var view = new SceneView({
        scale: 123456789,
        container: "viewDiv",
        map: map
      });
      var searchWidget = new Search({
        view: view
      });
      // Add the search widget to the very top left corner of the view
      view.ui.add(searchWidget, {
        position: "top-left",
        index: 0
      });
    });
  </script>
The other option will be to the  search widget multiple sources option, how do I call the google api function on its on without including google map function initMap.
Thanks for all your help...

Outcomes