Javascript 带有标签的谷歌地图api标记
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/28687094/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
google maps api marker with label
提问by Kaylee YunKyung Kim
I have
我有
var marker = new MarkerWithLabel({
position: uav.Position,
icon: mapStyles.uavSymbolBlack,
labelContent: uav.Callsign +
'<div style="text-align: center;"><b>Alt: </b>' + uav.Alt +
'<br/><b>Bat: </b>' +
uav.Battery + '</div>',
labelAnchor: new google.maps.Point(95, 20),
labelClass: "labels",
labelStyle: { opacity: 0.75 },
zIndex: 999999,})
This marker in my JavaScript file, but java console keep giving me an error.
这个标记在我的 JavaScript 文件中,但 java 控制台一直给我一个错误。
Uncaught ReferenceError: MarkerWithLabel is not defined
I thought MarkerWithLabel is the built-in of the google maps api. But it doens't work.
我认为 MarkerWithLabel 是 google maps api 的内置。但它不起作用。
回答by geocodezip
MarkerWithLabel is not part of the Google Maps Javascript API v3, it is in a third party library MarkerWithLabel.
MarkerWithLabel 不是Google Maps Javascript API v3 的一部分,它位于第三方库MarkerWithLabel 中。
One indication is that if it was part of the API it would be google.maps.MarkerWithLabel.
一个迹象是,如果它是 API 的一部分,它将是 google.maps.MarkerWithLabel。
-文件
-例子
code snippet:
代码片段:
var map;
function initialize() {
map = new google.maps.Map(
document.getElementById("map_canvas"), {
center: new google.maps.LatLng(37.4419, -122.1419),
zoom: 13,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var marker = new MarkerWithLabel({
position: map.getCenter(),
// icon: mapStyles.uavSymbolBlack,
labelContent: "uav.Callsign" + '<div style="text-align: center;"><b>Alt: </b>' + "uav.Alt" + '<br/><b>Bat: </b>' + "uav.Battery" + '</div>',
labelAnchor: new google.maps.Point(95, 20),
labelClass: "labels",
labelStyle: {
opacity: 0.75
},
zIndex: 999999,
map: map
})
}
google.maps.event.addDomListener(window, "load", initialize);
html, body, #map_canvas {
height: 500px;
width: 500px;
margin: 0px;
padding: 0px
}
.labels {
background-color: white;
border-style: solid;
border-width: 1px;
}
<script src="https://maps.googleapis.com/maps/api/js"></script>
<script src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerwithlabel/src/markerwithlabel.js"></script>
<div id="map_canvas" style="width:750px; height:450px; border: 2px solid #3872ac;"></div>

