Google Maps API標記不起作用

我想簡單地獲取要顯示的標記。我使用Google的示例作爲指南，因爲這是我第一次使用Google Maps API。下面的代碼我找不到任何語法問題。爲什麼它不加載標記？Google Maps API標記不起作用

<!DOCTYPE html> 
<html> 
<head> 
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 
<style type="text/css"> 
     html { height: 100% } 
     body { height: 100%; margin: 0px; padding: 0px } 
     #map_canvas { height: 100%; z-index: 0;} 
     #gmnoprint {width: auto;} 
</style> 
<meta http-equiv="content-type" content="text/html; charset=utf-8"/> 
<title>Google Map of Floor Plan</title> 
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script> 
<script> 
function CustomMapType() { 
} 
CustomMapType.prototype.tileSize = new google.maps.Size(256,256); 
CustomMapType.prototype.maxZoom = 4; 
CustomMapType.prototype.getTile = function(coord, zoom, ownerDocument) { 
    var div = ownerDocument.createElement('DIV'); 
    var baseURL = 'C:/Temp'; 
    baseURL += zoom + '_' + coord.x + '_' + coord.y + '.png'; 
    div.style.width = this.tileSize.width + 'px'; 
    div.style.height = this.tileSize.height + 'px'; 
    div.style.backgroundColor = '#1B2D33'; 
    div.style.backgroundImage = 'url(' + baseURL + ')'; 
    return div; 
}; 

CustomMapType.prototype.name = "Custom"; 
CustomMapType.prototype.alt = "Tile Coordinate Map Type"; 
var map; 
var CustomMapType = new CustomMapType(); 
function initialize() { 
    var myLatlng = new google.maps.LatLng(65, -56); 
    var mapOptions = { 
     minZoom: 0, 
     maxZoom: 4, 
     isPng: true, 
     mapTypeControl: false, 
     streetViewControl: false, 
     center: new google.maps.LatLng(65.07,-56.08),  
     zoom: 3, 
     mapTypeControlOptions: { 
     mapTypeIds: ['custom', google.maps.MapTypeId.ROADMAP], 
     style: google.maps.MapTypeControlStyle.DROPDOWN_MENU 
     } 
    }; 
    var marker = new google.maps.Marker({ 
     position: myLatlng, 
     map: map, 
     title: 'Hello World' 
    }); 

    map = new google.maps.Map(document.getElementById("map_canvas"),mapOptions); 
    map.mapTypes.set('custom',CustomMapType); 
    map.setMapTypeId('custom'); 
} 

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

</script> 
</head> 
<body onload="initialize()"> 
<div id="map_canvas" style="background: #1B2D33;"></div> 
</body> 
</html>

來源

2014-07-15 user3842086

您是否嘗試在實例化映射後移動標記？ – Dylan

時創建地圖已不在的時候初始化：

var marker = new google.maps.Marker({ 
    position: myLatlng, 
    map: map, 
    title: 'Hello World' 
}); 

map = new google.maps.Map(document.getElementById("map_canvas"),mapOptions);

所以，你必須創建map，然後再使用它：

map = new google.maps.Map(document.getElementById("map_canvas"),mapOptions); 

var marker = new google.maps.Marker({ 
    position: myLatlng, 
    map: map, 
    title: 'Hello World' 
});

或調用setMap上調用初始化地圖後的標記：

var marker = new google.maps.Marker({ 
    position: myLatlng, 
    title: 'Hello World' 
}); 

map = new google.maps.Map(document.getElementById("map_canvas"),mapOptions); 

marker.setMap(map);

來源

2014-07-15 21:24:44

感謝這工作！ – user3842086

Google Maps API標記不起作用

回答

相關問題