我正在尝试在Google地图上放置一些标记。我在下面写了代码。
问题是我没有看到任何这些标记。
我检查了控制台,没有看到任何错误。
我做错了什么?
非常感谢。
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<title>Directions service</title>
<style>
html, body, #map-canvas {
height: 100%;
margin: 0px;
padding: 0px
}
#panel {
position: absolute;
top: 5px;
left: 50%;
margin-left: -180px;
z-index: 5;
background-color: #fff;
padding: 5px;
border: 1px solid #999;
}
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script>
var map;
var styles = [
{
stylers: [
{hue: "#00ffe6"},
{saturation: -20}
]
}, {
featureType: "road",
elementType: "geometry",
stylers: [
{lightness: 100},
{visibility: "simplified"}
]
}, {
featureType: "poi",
elementType: "labels",
stylers: [
{visibility: "off"}
]
}, {
featureType: "transit",
elementType: "labels",
stylers: [
{visibility: "off"}
]
},
];
function initialize() {
var home = new google.maps.LatLng(45.666396, 25.611569);
var mapOptions = {
zoom: 15,
center: home
}
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
map.setOptions({styles: styles});
}
var json = [
{
"title": "Triaj",
"lat": 45.67573,
"lng": 25.647464,
"description": "Test"
}, {
"title": "Baza MTTC",
"lat": 45.671123,
"lng": 25.640974,
"description": "Test"
}, {
"title": "RAT Brasov",
"lat": 45.669687,
"lng": 25.638461,
"description": "Test"
} ];
for (var i = 0, length = json.length; i < length; i++) {
var data = json[i], latLng = new google.maps.LatLng(data.lat, data.lng);
// Creating a marker and putting it on the map
var marker = new google.maps.Marker({
position: latLng,
map: map,
title: data.title
});
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map-canvas"></div>
</body>
</html>
答案 0 :(得分:3)
你不应该将json和marker代码放在initialize
- 函数中以触发它吗?
现在,没有任何东西触发for循环,因此标记不会显示。将var json =
和所有内容放到initialize
- 函数内的for循环的末尾,你应该很好:)