gpt4 book ai didi

javascript - Bing map - 如何从 map 外部的链接链接到图钉

转载 作者:行者123 更新时间:2023-11-29 20:25:55 26 4
gpt4 key购买 nike

我有一个虚拟地球 map (Bing map ??),我在其中添加了一组图钉。每个图钉都标有 1 到 n。除了向 map 添加图钉外,我还向包含每个图钉描述的网页添加文本。

我想添加一个指向 map 外文本的链接,单击该链接将打开与相应图钉关联的气球。

如何通过 map 外部的链接打开与图钉关联的气球?

为了更好地理解,请查看我的 map :link .单击加载时,图钉将添加到 map 中。我想要 map 右侧列表中的链接,该链接可打开相应的 PushPin。

提前致谢!

最佳答案

这是一个使用 Bing map 向 map 添加一些形状并在 map 旁边的列表中显示每个形状的“标题”的简单示例。然后,当用户将鼠标悬停在列表中的每个项目上时,它将在 map 上打开该形状的信息框。

<!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=6.2"></script>
<style type="text/css">
#ShapeList div
{
padding: 4px;
border: solid 1px black;
}
</style>
<script type="text/javascript">
var map = null;

function GetMap()
{
map = new VEMap('myMap');
map.LoadMap();

// Add some Shapes to the Map with item in list next to map
var latlong = map.GetCenter();
AddShape("Test Pushpin", latlong);
AddShape("Another Pushpin", new VELatLong(latlong.Latitude + 2, latlong.Longitude));
AddShape("Still Another Pushpin", new VELatLong(latlong.Latitude - 2, latlong.Longitude));
}

function AddShape(title, latlong) {
// Create Pushpin Shape
var s = new VEShape(VEShapeType.Pushpin, latlong);
s.SetTitle(title);

// Add Shape to Map
map.AddShape(s);

// Display Item in List Next to Map
var elem = document.createElement("div");
elem.innerHTML = title;
document.getElementById("ShapeList").appendChild(elem);

var shapeID = s.GetID();
elem.attachEvent("onmouseover", function() { ShowInfoBoxByShapeID(shapeID); });
elem.attachEvent("onmouseout", function() { map.HideInfoBox(); });
}

function ShowInfoBoxByShapeID(shapeID) {
var shape = map.GetShapeByID(shapeID);
map.ShowInfoBox(shape);
}

</script>
</head>
<body onload="GetMap();">
<div id="ShapeList" style="float: left">
</div>
<div id='myMap' style="position:relative; width:400px; height:400px;"></div>
</body>
</html>

关于javascript - Bing map - 如何从 map 外部的链接链接到图钉,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1061529/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com