谷歌地图V3绘图(谷歌示例不加载地图)
google maps v3 drawing (Google sample does not load map)
JS和一般编程新手。我想了解更多关于GMaps绘图工具的信息。要了解GMaps,他们自己的示例代码到目前为止是开始研究和实验的最佳点,但是对于绘图工具,情况似乎并非如此。其开发人员网站上提供的示例代码运行一个空白页。这可能是一个愚蠢的问题,答案是显而易见的,但是,我该如何解决这个问题?
<!DOCTYPE html>
<html>
<head>
<title>Drawing tools</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<link href="/maps/documentation/javascript/examples/default.css" rel="stylesheet">
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=drawing"></script>
<script>
function initialize() {
var mapOptions = {
center: new google.maps.LatLng(-34.397, 150.644),
zoom: 8,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
var drawingManager = new google.maps.drawing.DrawingManager({
drawingMode: google.maps.drawing.OverlayType.MARKER,
drawingControl: true,
drawingControlOptions: {
position: google.maps.ControlPosition.TOP_CENTER,
drawingModes: [
google.maps.drawing.OverlayType.MARKER,
google.maps.drawing.OverlayType.CIRCLE,
google.maps.drawing.OverlayType.POLYGON,
google.maps.drawing.OverlayType.POLYLINE,
google.maps.drawing.OverlayType.RECTANGLE
]
},
markerOptions: {
icon: 'http://labs.google.com/ridefinder/images/mm_20_blue.png'
},
circleOptions: {
fillColor: '#ffff00',
fillOpacity: 1,
strokeWeight: 5,
clickable: false,
editable: true,
zIndex: 1
}
});
drawingManager.setMap(map);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map-canvas"></div>
</body>
</html>
与原始代码相比,这里只更改了标记图像的来源。
您需要调整地图画布元素的大小。将以下内容添加到样式表中。
#map-canvas {display: block; height: 300px; width: 600px;}
看看这是否可行。
相关文章:
- 谷歌地图API v3获胜't加载地图后禁用滚轮
- Google Map JS API-加载地图分幅,但所有图像(标记、缩放控制等)都不加载;t负载2分钟
- 使用Geolocation以引导模式加载地图,标记不会居中
- 谷歌地图-重新加载地图
- 如何访问已加载地图图块的源路径
- 使用自己的 JavaScript 函数加载地图图块
- 如何在平移时加载和销毁地图,而不是在加载时完全加载地图
- 谷歌地图V3绘图(谷歌示例不加载地图)
- 有人能帮我理解逻辑并修复它以加载地图吗
- AngularJS:NgMap-加载地图中心是'不受尊重
- Google maps API不加载地图
- 如何在ajax接收到数据后加载地图
- 引导自动完成不加载地图
- 使用$. getjson从JSON中加载地图数据
- 显示位置的变化在谷歌地图上没有重新加载地图一次又一次
- 地理定位:只移动谷歌地图标记,而不重新加载地图
- 从谷歌地图的URL加载地图到ExtJS GMapPanel
- 使用Google Maps API v3重新加载地图上的点
- Googlemap api v3给出了一个错误,而不是不加载地图
- 刷新/重新加载地图:谷歌地图API V2