2017-01-08 4 views
0
<script> 

    function initMap() { 
     var map = new google.maps.Map(document.getElementById('map'), { 
      center: { lat: 33.738045, lng: 73.084488 }, 
      zoom: 10 
     }); 
     new AutocompleteDirectionsHandler(map); 
    } 



    /** 
    * @constructor 
    */ 
    function AutocompleteDirectionsHandler(map) { 
     this.map = map; 
     this.originPlaceId = null; 
     this.destinationPlaceId = null; 
     this.travelMode = 'DRIVING'; 
     var originInput = document.getElementById('origin-input'); 
     var destinationInput = document.getElementById('destination-input'); 
     var modeSelector = document.getElementById('mode-selector'); 
     this.directionsService = new google.maps.DirectionsService; 
     this.directionsDisplay = new google.maps.DirectionsRenderer({ 'draggable': true }); 
     this.directionsDisplay.setMap(map); 

     var originAutocomplete = new google.maps.places.Autocomplete(
      originInput, { placeIdOnly: true }); 
     var destinationAutocomplete = new google.maps.places.Autocomplete(
      destinationInput, { placeIdOnly: true }); 

     this.setupClickListener('changemode-walking', 'DRIVING'); 


     this.setupPlaceChangedListener(originAutocomplete, 'ORIG'); 
     this.setupPlaceChangedListener(destinationAutocomplete, 'DEST'); 

     this.map.controls[google.maps.ControlPosition.TOP_LEFT].push(originInput); 
     this.map.controls[google.maps.ControlPosition.TOP_LEFT].push(destinationInput); 
     this.map.controls[google.maps.ControlPosition.TOP_LEFT].push(modeSelector); 
    } 

    // Sets a listener on a radio button to change the filter type on Places 
    // Autocomplete. 
    AutocompleteDirectionsHandler.prototype.setupClickListener = function (id, mode) { 
     var radioButton = document.getElementById(id); 
     var me = this; 
     radioButton.addEventListener('click', function() { 
      me.travelMode = 'DRIVING'; 
      me.route(); 
     }); 
    }; 

    AutocompleteDirectionsHandler.prototype.setupPlaceChangedListener = function (autocomplete, mode) { 
     var me = this; 
     autocomplete.bindTo('bounds', this.map); 
     autocomplete.addListener('place_changed', function() { 
      var place = autocomplete.getPlace(); 
      if (!place.place_id) { 
       window.alert("Please select an option from the dropdown list."); 
       return; 
      } 
      if (mode === 'ORIG') { 
       me.originPlaceId = place.place_id; 
      } else { 
       me.destinationPlaceId = place.place_id; 
      } 
      me.route(); 
     }); 

    }; 

    AutocompleteDirectionsHandler.prototype.route = function() { 
     if (!this.originPlaceId || !this.destinationPlaceId) { 
      return; 
     } 
     var me = this; 

     this.directionsService.route({ 
      origin: { 'placeId': this.originPlaceId }, 
      destination: { 'placeId': this.destinationPlaceId }, 
      travelMode: this.travelMode 
     }, function (response, status) { 
      if (status === 'OK') { 
       me.directionsDisplay.setDirections(response); 
      } else { 
       window.alert('Directions request failed due to ' + status); 
      } 
     }); 
    }; 


</script> 

Zur Zeit mache ich ein Projekt in asp.net C# Web-Formulare lesen, die den Standort liest und es in der DatenbankWie Land Stadt Breitengrad Längengrad in Karten API

ich das Land Stadt Breitengrad finden wollen sparen Länge, wenn die Marker gezogen werden und die Suchfelder nach Markerpositionen binden wollen

Antwort

0

Wenn Sie nach den Details (Land, Stadt, Breite, Länge) des ursprünglichen Ursprungs und des Ziels suchen, entfernen Sie vor dem Ziehen der Wegbeschreibung einfach { placeIdOnly: true } von google.maps.places.Autocomplete() Anrufe.

Wenn Sie nach den Details sind (Land, Stadt, Breite, Länge) der Orte, an denen Markierungen gezogen werden, wenn ein Benutzer Richtungen ziehen, müssen Sie

  1. einen Listener hinzufügen auf Ihre directionsDisplay für 'directions_changed'. Siehe directions-draggable example.
  2. In der Callback-Funktion, überprüfen Sie die start_location aller legs, und end_location der letzten, um Wegpunkte zu bekommen.
Verwandte Themen