Question

我尝试为自己的应用程序进行自动填充，并将其显示给我的Google地图，但效果不佳。

代码位于名为autocomplete.js的单独js文件中

我已经在应用中有谷歌地图所以我想使用相同的。谷歌地图的ID是：googleMap 搜索按钮的ID为：autosearch 输入的id是：autoinput

"use strict"; 

var input = document.getElementById('autoinput');
var options = {
  bounds: defaultBounds,
  types: ['establishment']
};

autocomplete = new google.maps.places.Autocomplete(input, options);

function geolocate() {
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function(position) {
      var geolocation = {
        lat: position.coords.latitude,
        lng: position.coords.longitude
      };
      var circle = new google.maps.Circle({
        center: geolocation,
        radius: position.coords.accuracy
      });
      autocomplete.setBounds(circle.getBounds());
    });
  }
}

var input = document.getElementById('autoinput');
var options = {
  types: ['(cities)'],
  componentRestrictions: {country: 'be'}
};

function fillInAddress() {

  var place = autocomplete.getPlace();



var defaultBounds = document.getElementById('googleMap')(
  new google.maps.LatLng(-33.8902, 151.1759),
  new google.maps.LatLng(-33.8474, 151.2631));

var input = document.getElementById('autoinput');

var searchBox = new google.maps.places.SearchBox(input, {
  bounds: defaultBounds
});


  searchBox.addListener('places_changed', function() {
    var places = searchBox.getPlaces();

    if (places.length == 0) {
      return;
    }

    // Clear out the old markers.
    markers.forEach(function(marker) {
      marker.setMap(null);
    });
    markers = [];


    var bounds = new google.maps.LatLngBounds();
    places.forEach(function(place) {
      var icon = {
        url: place.icon,
        size: new google.maps.Size(71, 71),
        origin: new google.maps.Point(0, 0),
        anchor: new google.maps.Point(17, 34),
        scaledSize: new google.maps.Size(25, 25)
      };
      markers.push(new google.maps.Marker({
        map: map,
        icon: icon,
        title: place.name,
        position: place.geometry.location
      }));
      if (place.geometry.viewport) {
        // Only geocodes have viewport.
        bounds.union(place.geometry.viewport);
      } else {
        bounds.extend(place.geometry.location);
      }
    });
    map.fitBounds(bounds);
  });
};

我更改了代码等，但我想我删除了我需要的东西。

这是地理定位的另一个名为locationSearch.js的js文件：

var google;

$( document ).ready(function() {
    zoekLocatie();
});

function zoekLocatie() {
      var output = document.getElementById("googleMap");

      navigator.geolocation.getCurrentPosition(success, error);
      output.innerHTML = "<p>Looking for your location...</p>";
      if (!navigator.geolocation) {
        output.innerHTML = "<p>Your browser doesn't support geolocation</p>";
        return;
      }



      function success(position) {
        var latitude = position.coords.latitude;
        var longitude = position.coords.longitude;

        var mapProp = {
          center: new google.maps.LatLng(latitude, longitude),
          zoom: 18,
          mapTypeId: google.maps.MapTypeId.SATELLITE  
        };
        var map = new google.maps.Map(document.getElementById("googleMap"), mapProp);

        var geocoder = new google.maps.Geocoder;
        var infowindow = new google.maps.InfoWindow;

        geocodeLatLng(geocoder, map, infowindow);

        function geocodeLatLng(geocoder, map, infowindow) {
          var input = latitude + "," + longitude;
          var latlngStr = input.split(',', 2);
          var latlng = {lat: parseFloat(latlngStr[0]), lng: parseFloat(latlngStr[1])};
          geocoder.geocode({'location': latlng}, function(results, status) {
            if (status === google.maps.GeocoderStatus.OK) {
              if (results[1]) {
                map.setZoom(18);
                var marker = new google.maps.Marker({
                  position: latlng,
                  map: map
                });
                infowindow.setContent(results[1].formatted_address);

                address.innerHTML = results[1].formatted_address;

                infowindow.open(map, marker);
              } else {
                window.alert('No results found');
              }
            } else {
              window.alert('Geocoder failed due to: ' + status);
            }
          });
        }

Answer 1

你这里有错误

use strict";

你应该删除“

你在哪里调用谷歌地图功能？

Autocompletion en在地图上显示

1 个答案: