谷歌地图v3：地图不显示

有人可以帮我Google Maps API？我试图通过API显示地图，但地图无处可见。我已经编写了一个小提琴来展示我的意思。我会喜欢这个帮助。 Here's the fiddle.谷歌地图v3：地图不显示

的Javascript：

//Map Options 
 
var roadmap = { 
 
    infoWindow: new google.maps.InfoWindow(), 
 
    options: { 
 
    map: { 
 
     center: new google.maps.LatLng(34.02238, -118.293338), 
 
     zoom: 15, 
 
     mapTypeId: 'roadmap' 
 
    }, 
 
    marker: { 
 
     position: roadmap.options.center, 
 
     title: "Hello", 
 
     icon: 'http://maps.google.com/mapfiles/ms/micons/blue-dot.png', 
 
     shadow: 'http://maps.google.com/mapfiles/ms/micons/msmarker.shadow.png' 
 
    } 
 
    } 
 
}; 
 

 
//Street view Options 
 
var StreetView = { 
 
    options: { 
 
    position: roadmap.options.map.center, 
 
    zoom: 1 
 
    } 
 
}; 
 

 
//Functions 
 
function bindInfoWindow(marker, map, infoWindow, html) { 
 
    google.maps.event.addListener(marker, 'click', function() { 
 
    infoWindow.setContent(html); 
 
    infoWindow.open(map, marker); 
 
    infoWindow.getContent(); 
 
    marker.openInfoWindowTabsHtml(infoTabs); 
 
    }); 
 
} 
 

 
function googleMaps() { 
 
    //Road map 
 
    roadmap.map = new google.maps.Map(document.getElementById("map"), roadmap.options.map); 
 

 
    //Road map's Marker 
 
    roadmap.options.marker.map = roadmap.map; 
 
    roadmap.marker = new google.maps.Marker(roadmap.options.marker); 
 

 
    //Street view map 
 
    StreetView.map = new google.maps.StreetViewPanorama(document.getElementById("map_StreetView"), StreetView.options); 
 

 
    //Bind onClick to marker & infoWindow 
 
    bindInfoWindow(roadmap.marker, roadmap.map, roadmap.infoWindow, roadmap.options.marker.title); 
 
} //end of load() 
 

 

 
/*Load | Call googleMaps after document is loaded*/ 
 
google.maps.event.addDomListener(window, 'load', function() { 
 
    googleMaps(); 
 
    //... (add more code here) 
 
});

HTML：

<!-- START: Google Maps API --> 
 
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script> 
 
<script type="text/javascript" src="this_map.js"></script> 
 
<!-- __END: Google Maps API --> 
 

 
<div id="map-container" > 
 
    <div id="map_StreetView" style="width: 350px; height: 250px"></div><br/> 
 
    <div id="map" style="width: 350px; height: 250px"></div> 
 
</div>

来源

2012-05-30 Omar

“未捕获的异常：TypeError：无法将”路标图“转换为对象”。打开控制台可能会非常有帮助。 – Styxxy

@ matt-handy谢谢matt-handy。我的注释也发现了一些错误。这里是你的更正和纠正意见的小提琴：http://jsfiddle.net/TZyCP/7/ – Omar

的错误是在这里：

position: roadmap.options.center

您不能引用一个对象，你刚刚创建。

我把它改为：

position: new google.maps.LatLng(34.02238, -118.293338)

和它的工作。

这是你的工作小提琴：http://jsfiddle.net/sGHqa/。

来源

2012-05-30 20:09:29

TypeError: 'undefined' is not an object (evaluating 'roadmap.options') Whiiiiiiiiich是一种意料之中的，因为你要定义路线图......

来源

2012-05-30 20:07:53 dda

谷歌地图v3：地图不显示

回答

相关问题