Google Map API 创建标记错误（Javascript API）答案

【问题标题】：Google Map API creating Marker Error (Javascript API)Google Map API 创建标记错误（Javascript API）
【发布时间】：2017-01-19 02:34:14
【问题描述】：

我很难创建一个函数来在谷歌地图上创建标记。以下是我目前拥有的 javascript 代码。

如您所见，我使用new google.maps.Map(document.getElementById('map') 创建了一个地图。

然后我创建了一个createMarker 函数并尝试使用该函数通过传递lat, lng, draggable 参数来创建一个新标记。

但是，当我运行它时，我不断得到：

map.createMarker 不是函数。

有人可以帮我解决这个问题吗？

function initMap() {
  // var fullstack = {lat: 40.705523, lng: -74.009149};
  var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 18,
    maxZoom: 19,
    minZoom: 16 ,
    center: {lat: 40.705523, lng: -74.009149},
    disableDefaultUI: false
  });

  var marker = map.createMarker(40.705523, -74.009149, true);

  var createMarker = function(lat, lng, draggable) {
    return new google.maps.Marker({
      position: {
        lat: lat,
        lng: lng
      },
      map: map,
      draggable: draggable
    })
  }
}

【问题讨论】：

标签： javascript jquery html google-maps google-maps-api-3

【解决方案1】：

您的 createMarker 函数与地图没有关联。将map.createMarker(...) 更改为createMarker(...)
将函数声明为变量时，顺序很重要。您需要在使用之前声明该函数。

工作代码sn-p：

function initMap() {
  // var fullstack = {lat: 40.705523, lng: -74.009149};
  var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 18,
    maxZoom: 19,
    minZoom: 16 ,
    center: {lat: 40.705523, lng: -74.009149},
    disableDefaultUI: false
  });
  var createMarker = function(lat, lng, draggable) {
    return new google.maps.Marker({
      position: {
        lat: lat,
        lng: lng
      },
      map: map,
      draggable: draggable
    })
  }
  var marker = createMarker(40.705523, -74.009149, true);
}

html,
body,
#map {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
}

<script async defer src="https://maps.googleapis.com/maps/api/js?callback=initMap"></script>
<div id="map"></div>

【讨论】：

【解决方案2】：

createMarker 不是函数，映射到映射对象，尝试像我在这里一样调用 createMarker。

function initMap() {
  // var fullstack = {lat: 40.705523, lng: -74.009149};
  var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 18,
    maxZoom: 19,
    minZoom: 16 ,
    center: {lat: 40.705523, lng: -74.009149},
    disableDefaultUI: false
  });

  var marker = createMarker(40.705523, -74.009149, true);

  var createMarker = function(lat, lng, draggable) {
    return new google.maps.Marker({
      position: {
        lat: lat,
        lng: lng
      },
      map: map,
      draggable: draggable
    })
  }
}

【讨论】：