如何从图钉内的pushpinoption获取信息框

时间:2015-01-29 10:46:02

标签: javascript html5 bing-maps

我使用Bing地图与html5和JavaScript。

我想知道是否可以通过JavaScript在infoboxpushpinoption获取pushpin

我使用JavaScript有这样的东西:

var location = new Microsoft.Maps.Location(latitude, longitude);

var pinInfoBox = new Microsoft.Maps.Infobox(new Microsoft.Maps.Location(latitude, longitude), { id: "Id_" + p_Data[i][0], title: desc, visible: true });

var pushPinOption = { icon: etat, width: 30, height: 50, infobox: pinInfoBox };

var pushPin = new Microsoft.Maps.Pushpin(location, pushPinOption);

map.entities.push(pushPin);
m_VehiculeArray.push(pushPin);

在使用JavaScript的其他功能中,我可以访问pushpin,但我不知道如何检索pushpinOption,最后检索infobox。我需要阅读' id'属性。

你能帮我吗?

1 个答案:

答案 0 :(得分:0)

我不太确定我明白你要做什么,但如果你认为这不能满足你的需求,请解释你想要实现的功能,这样我们就可以提供帮助。

无论如何,如果您打算有可能从儿童属性中检索信息(例如Pushpin> PushpinOption>信息框),您将有几种可能实现它,但有一种可能是利用可能性Bing Maps Ajax V7 Control附带的扩展,这是一个示例,将说明如何在Pushpin对象上保留具体的附加属性。

示例代码

请参阅将说明扩展功能用法的示例代码:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Bing Maps for Enterprise - Extension</title>
    <script type="text/javascript" charset="UTF-8" src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0">
    </script>
    <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.2.min.js" type="text/javascript"></script>
    <script type="text/javascript">

        var map = null;
        var polygon = null;

        // Extension
        if (typeof (Microsoft) !== 'undefined') {
            if (typeof (Microsoft.Maps) !== 'undefined') {
                Microsoft.Maps.Pushpin.prototype.dataObject = null,
                Microsoft.Maps.Pushpin.prototype.id = null
            }
        }

        function getMap() {

            // Initialize the map
            map = new Microsoft.Maps.Map($('#map').get(0), {
                credentials: "BINGMAPSKEY",
                center: new Microsoft.Maps.Location(47.5, 2.75),
                zoom: 4,
                mapTypeId: Microsoft.Maps.MapTypeId.road,
                maxZoomLevel: 28
            });

            pin = new Microsoft.Maps.Pushpin(new Microsoft.Maps.Location(45, 2));
            pin.id = "pin-myid";
            pin.dataObject = {
                title: 'My pushpin',
                description: 'Short description'
            };
            map.entities.push(pin);
            Microsoft.Maps.Events.addHandler(pin, 'click', clickPin);
        }

        function clickPin(e) {
            if (e.targetType == 'pushpin') {
                alert(e.target.id + ' == ' + e.target.dataObject.title);
            }
        }    

    </script>
</head>
<body onload="getMap();">
    <div id="map" style="position: relative; width: 800px; height: 600px;">
    </div>
</body>
</html>

更多信息

如果您需要有关扩展功能的更多信息,请参阅此处提供的帖子博客(法语):

http://blogs.developpeur.org/nicoboo/archive/2012/03/23/bing-maps-for-enterprise-profitez-des-possibilites-d-extension-du-controle-ajax-v7.aspx