Question

我已经启动并运行了地图，但是我无法在纬度处种植标记，并且长期在“中心”指定了标记。和＆＃39;位置＆＃39;有人看到错误吗？我之前有这个工作，但是在添加了样式数组后，它停了下来，我一定是不小心弄乱了一些东西，但我现在还没有看到它。

<div id="map"></div>

<script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>

<script>
    var map;
    function initialize() {
        var mapOptions = {
            zoom: 17,
            center: new google.maps.LatLng(36, -110),
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            styles: styleArray,
            scrollwheel: false,
        };
        map = new google.maps.Map(document.getElementById('map'),
  mapOptions);
    }

    google.maps.event.addDomListener(window, 'load', initialize);

    var styleArray = [
        {
            featureType: "all",
            stylers: [ { saturation: -80 } ]
        },
        {
            featureType: "road.arterial",
            elementType: "geometry",
            stylers: [ { hue: "#00ffee" }, { saturation: 50 } ]
        },
        {
            featureType: "poi.business",
            elementType: "labels",
            stylers: [ { visibility: "off" } ]
        }
    ];

    var marker = new google.maps.Marker({
        position: (36, -110),
        title:"Hello World!",
        map: (google.maps.MapTypeId.ROADMAP),
    });

    marker.setMap(google.maps.MapTypeId.ROADMAP);

</script>

Answer 1

发布的代码中存在javascript错误：

InvalidValueError: setPosition: not a LatLng or LatLngLiteral: not an Object
InvalidValueError: setMap: not an instance of Map; and not an instance of StreetViewPanorama

您的代码有几个问题：

您的标记在initialize函数之外被实例化（因此在定义map变量之前将其实例化。将其移动到initialize函数内。
< / LI>
marker.setMap函数以google.maps.Map对象作为参数，这是不正确的：
```
marker.setMap(google.maps.MapTypeId.ROADMAP);
```

应该是：

marker.setMap(map);

这是不正确的，位置必须是google.maps.LatLng对象或google.maps.LatLngLiteral，(36, -110)不是，map属性必须是{ {1}};这个：
```
google.maps.LatLng
```

应该是：

var marker = new google.maps.Marker({
  position: (36, -110),
  title:"Hello World!",
  map: (google.maps.MapTypeId.ROADMAP),
});

proof of concept fiddle

代码段

var marker = new google.maps.Marker({
    position: google.maps.LatLng(36, -110),
    title:"Hello World!",
    map: map,
});

var map;

function initialize() {
  var mapOptions = {
    zoom: 17,
    center: new google.maps.LatLng(36, -110),
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    styles: styleArray,
    scrollwheel: false,
  };
  map = new google.maps.Map(document.getElementById('map'),
    mapOptions);
  var marker = new google.maps.Marker({
    position: new google.maps.LatLng(36, -110),
    title: "Hello World!",
    map: map,
  });

  marker.setMap(map);
}

google.maps.event.addDomListener(window, 'load', initialize);

var styleArray = [{
  featureType: "all",
  stylers: [{
    saturation: -80
  }]
}, {
  featureType: "road.arterial",
  elementType: "geometry",
  stylers: [{
    hue: "#00ffee"
  }, {
    saturation: 50
  }]
}, {
  featureType: "poi.business",
  elementType: "labels",
  stylers: [{
    visibility: "off"
  }]
}];


google.maps.event.addDomListener(window, "load", initialize);

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

Answer 2

显示标记的4个步骤。

将您的密钥放在JS库中。像这样： https://maps.googleapis.com/maps/api/js?sensor=false&key=[YOUR GOOGLE KEY] 有关详细信息，请访问this page。
将创建标记的代码放入初始化方法中，只需确保在创建地图后初始化它。
标记位置应为实例new google.maps.LatLng(36, -110)，而不是代码(36, -110)
marker.setMap方法是不必要的，我们可以将其删除。

谷歌地图API，根本无法显示标记

2 个答案: