Question

如何为引脚上的点击事件设置回调函数？我需要两个引脚绿色（一个位置）和红色一个（聚集位置）。我正在使用v6 api。

到目前为止，这是代码：

var shape = new VEShape(VEShapeType.Pushpin, new VELatLong(pin.position.lat, pin.position.lng));
shape.SetTitle('<h2>'+pin.overlay.headline+'</h2>');
shape.SetDescription('<p>'+pin.overlay.text+'</p>');

var pinIcon = new VECustomIconSpecification();
pinIcon.Image = '/images/map/pin.png';
pinIcon.TextContent = '.';
shape.SetCustomIcon(pinIcon);

Answer 1

您不仅可以设置引脚的文本和图像 - 您可以使用CustomHTML属性将其指定为HTML元素。这使您可以处理点击或其他任何事件。

一个简单的例子就是一个带有内嵌点击处理程序的HTML图钉图片：

pinIcon.CustomHTML = "<img onclick='alert(\"tadaa\")' src='/images/map/pin.png' />";

如果要将代码与标记分开，例如使用jQuery，您可以指定pin的元素ID，稍后使用它来将click处理程序与它相关联。例如：

pinIcon.CustomHTML = "<img id='pin' src='/images/map/pin.png' />";
shape.SetCustomIcon(pinIcon);
...
map.AddShape(shape);
$("#pin").click(function() { alert("tadaa"); });

Answer 2

执行此操作的正确方法是覆盖onclick和onmouseover VEMap.AttachEvent（）中的函数; AttachEvent有许多返回值用于识别单击/鼠标悬停的引脚，例如pinID（VEMap.onclick（）方法的elementID返回值）。

您可以将ID与map.ShowInfoBox（）和map.GetShapeByID结合使用点击即可显示您的信息框。

阅读：VEMap.AttachEvent＆lt; - Google，我会粘贴网址，但我需要更多代表StackOverflow

阅读：VEMap.onclick。另外，了解返回值：

阅读所有鼠标事件 http://msdn.microsoft.com/en-us/library/bb412438.aspx

/*************************************
 * Code snippets..
 * For example purposes I'm going to do 
 * things a bit out of order.
*************************************/

// Attach your events in the map load callback:
map.AttachEvent("onmouseover", myFnForMouseOver);
map.AttachEvent("onclick", myFnForOnClick);


// Callback functions used in the AttachEvent(s) above..
function myFnForMouseOver(e){
    if(e.elementID){
        return true; // Disables the rollover ShowInfoBox()
    }
}

function myFnForOnClick(e){
    if(e.elementID){
        // Show infobox using the PINs/Shapes actual ID, (return value from e.elementID)
        map.ShowInfoBox(map.GetShapeByID(e.elementID)); 
        return true;
    }
}

/*
 * end 
 */

多数民众赞成

R Baker

Bing地图单击Pin上的事件

2 个答案: