可以't删除函数的映射部分

Can't remove map part of function

本文关键字:函数 映射部 删除 可以      更新时间:2023-09-26

我有一些代码大量借鉴了谷歌的例子。我所使用的只是这段代码的GooglePlaces结果部分,所以我想去掉map部分。因此,当我这样做时,它会抛出一个错误Cannot read property 'innerHTML' of undefined,因为我猜var service函数需要它。

删除此代码区域有什么帮助吗?

var map;
var infowindow;
// Create Google Map with location at center
function initMap(latitude, longitude) {
  var location = {lat: latitude, lng: longitude};
  console.log(location);
  // REMOVE THIS SECTION
  map = new google.maps.Map(document.getElementById('map'), {
    center: location,
    zoom: 15
  });
  // ^^ REMOVE THIS SECTION
  var service = new google.maps.places.PlacesService(map);
  service.nearbySearch({
    location: location,
    radius: 3200,
    types: ['school']
  }, callback);
}
// List nearby places
function callback(results, status) {
  if (status === google.maps.places.PlacesServiceStatus.OK) {
    for (var i = 0; i < results.length; i++) {
      listPlaces(results[i]);
    }
  }
}

好吧,它被称为"Google地图API",原因是:-)

此外,你可以隐藏地图,但服务条款包括要求在你的页面上的某个地方显示"谷歌供电"的标志。

您可以使用

<div id="map" style='display:none'></div>

在你的地图上
这样,它仍然可以让其他代码工作,并且不会显示在您的页面上

Ilya正确地认为,使用谷歌数据的许可证需要归属(请参阅https://developers.google.com/maps/documentation/javascript/places?hl=en#LogoRequirements)。

以前也有人问过类似的问题:谷歌放置没有地图的图书馆

为了去掉地图,我想你可以这样做:

map = new google.maps.Map(document.createElement('div'), {
    center: location,
    zoom: 15
});

通过这种方式,您永远不会向DOM添加任何内容。只需记住添加Powered by Google图形即可。(https://developers.google.com/places/documentation/images/powered-by-google.zip)

根据文档:

  1. 地图是不需要的,但如果没有显示,你必须显示一个带有该数据的"Powered by Google"标志:

如果您的应用程序在不同时显示谷歌地图的页面或视图上显示Google Places API数据,则必须显示带有该数据的"Powered by Google"徽标。

  1. PlacesService构造函数采用google.maps.Map对象或HTMLDivElement(您没有来提供映射,您可以提供div来显示管理属性)

建造商

PlacesService(attrContainer:HTMLDivElement|Map)创建PlacesService的一个新实例,该实例在指定的容器中呈现属性。

代码片段:

function initMap(latitude, longitude) {
  var location = {
    lat: latitude,
    lng: longitude
  };
  console.log(location);
  var service = new google.maps.places.PlacesService(document.getElementById('map'));
  service.nearbySearch({
    location: location,
    radius: 3200,
    types: ['school']
  }, callback);
}
// List nearby places
function callback(results, status) {
  if (status === google.maps.places.PlacesServiceStatus.OK) {
    for (var i = 0; i < results.length; i++) {
      document.getElementById('places').innerHTML += results[i].name + ", " + results[i].vicinity + "<br>";
      // listPlaces(results[i]);
    }
  } else {
    document.getElementById('places').innerHTML += "Status: " + status + "<br>";
  }
}
google.maps.event.addDomListener(window, "load", function() {
  initMap(40.7127837, -74.0059413);
});
#map {
  height: auto;
  width: 100%;
  margin: 0px;
  padding: 0px
}
<script src="https://maps.googleapis.com/maps/api/js?libraries=places"></script>
<div id="map"></div>
<div id="places"></div>
<img src="https://developers.google.com/places/documentation/images/powered-by-google-on-white.png" alt="Google Logo" />