我正在研究一个产品,该产品将显示威斯康星州各县的相关信息。是否有可能以编程方式在地图上写下该县的名字?我见过的唯一选择是通过创建一个贴图层。Bing Maps v7在地图上写字
1
A
回答
2
我已经写了关于如何在这里实现这个博客文章:http://rbrundritt.wordpress.com/2012/03/31/label-pushpins-in-bing-maps-v7/
下面是代码示例:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<script type="text/javascript" src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0"></script>
<script type="text/javascript">
var map = null;
function GetMap()
{
// Initialize the map
map = new Microsoft.Maps.Map(document.getElementById("myMap"),
{
credentials:"YOUR_BING_MAPS_KEY"
});
var labelPin = new Microsoft.Maps.Pushpin(new Microsoft.Maps.Location(0,0),{
text : 'Custom Label', //The text for the label
typeName : 'labelPin', //Assign a CSS class to the pin
anchor : new Microsoft.Maps.Point(0,0), //Reset the anchor point of the pin to make aligning the text easier.
textOffset : new Microsoft.Maps.Point(-45,0) //Adjust textOffset point for better label positioning
//Adjust the x value as you see fit for better centering of text
});
map.entities.push(labelPin);
}
</script>
<style>
/* Allow div of pushpin to display overflowing content */
.labelPin{
overflow:visible !important;
}
/* Hide the default pushpin, Alternatively point the icon property of the pushpin to a transparent image */
.labelPin img{
display:none;
}
/*Use this to style the text*/
.labelPin div{
white-space:nowrap;
color:blue !important;
}
</style>
</head>
<body onload="GetMap();">
<div id='myMap' style="position:relative; width:800px; height:600px;"></div>
</body>
</html>
1
只需使用具有自定义图像的图钉,并将自定义图像设置为透明图像,因此您看到的只是图钉文本。为了使真正的轻松,你甚至可以直接指定base64编码的透明图像内联,如下图所示:
var pushpinOptions = {
icon: "data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==",/* Transparent 1px x 1px gif with a 1bit palette, created with gimp and encoded with base64 tool in linux.*/
text: 'Your county name goes here',
draggable: false,
visible: true,
};
var pushpin = new Microsoft.Maps.Pushpin(new Microsoft.Maps.Location(47.6, - 122.33), pushpinOptions);
0
我不知道你用的是什么的后端,但方式我会做到这一点是执行以下操作:
AJAX调用回服务器,获取一个对象,返回以下或类似的东西 {CountyName =“铁”,北纬=“23”,东经= -100}
上回调,尽管如此,并填充自定义信息框。
相关问题
- 1. bing地图ajax v7集群
- 2. Bing Maps API v7限制
- 3. Bing Maps V7上下文菜单
- 4. 中心Bing地图V7围绕点阵
- 5. Bing地图v7不显示导航栏
- 6. 如何在Bing地图上创建自定义图钉v7
- 7. Bing地图.v7如何迭代map.entities?
- 8. bing地图v7制作网址
- 9. 集群图钉Bing地图AJAX控制v7 WP7
- 10. Bing Maps Ajax v7图钉移动放大/平移
- 11. Bing地图AJAX API V7地理位置回电
- 12. 从Bing Maps提取地图信息
- 13. 谷歌地图Api vs Bing Maps for C#
- 14. Google Maps API与Multimap/Bing地图API
- 15. 如何在Bing Maps v7 API中添加路线指引?
- 16. 当在一个AJAX面板内Bing Maps v7问题
- 17. Bing Maps API - setBounds
- 18. bing maps RouteResponse.Results.RoutePath.Points = null?
- 19. Bing地图上的3D
- 20. 在Bing地图控件上绘图
- 21. Bing Maps SDK - Silverlight
- 22. Multimarkers在Bing地图
- 23. Windows Phone 7 - Bing Maps
- 24. Bing地图streetview
- 25. Bing Maps v8 JS API
- 26. 如何禁用鼠标滚动Bing Maps v7中的标记
- 27. MS MapCruncher - Silverlight Bing Maps
- 28. Bing Maps上下文菜单
- 29. Silverlight Bing Maps - Pushpin
- 30. Bing Maps和MVVM