Google Maps API，根本无法显示标记

我已将地图启动并运行，但我无法在“中心”和“位置”上指定纬度和长度的标记。有没有人看到错误？我早些时候做了这个工作，但是在添加了样式数组之后，它停了下来，我一定会意外地搞砸了一些东西，但是现在我没有看到它。Google Maps API，根本无法显示标记

<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>

来源

2017-07-25 BEE EEE

有在发布代码的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函数中。
的marker.setMap函数采用一个google.maps.Map对象作为其参数，这是不正确的：
```
marker.setMap(google.maps.MapTypeId.ROADMAP); 
```

应该是：

marker.setMap(map);

这是不正确的，位置需要是google.maps.LatLng对象或google.maps.LatLngLiteral,(36, -110)既不是，map财产需要是google.maps.LatLng;这样的：

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

应该是：

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

proof of concept fiddle

代码片段：

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 
 
}

<script src="https://maps.googleapis.com/maps/api/js"></script> 
 
<div id="map"></div>

来源

2017-07-25 05:05:29 geocodezip

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方法是不必要的，我们可以将其删除。

来源

2017-07-25 05:36:01

Google Maps API，根本无法显示标记

回答

相关问题