Onclick信息框 - bing map api

时间:2015-03-17 21:43:56

标签: javascript hta bing-maps

我无法让bing API的信息框在地图外点击时打开。

这是show infobox功能和创建pin / infobox本身的功能:

function displayInfobox(e) {
pinInfobox.setOptions({
title: e.target.Title,
description: e.target.Description,
visible: true,
offset: new Microsoft.Maps.Point(0, 25)
});

pinInfobox.setLocation(e.target.getLocation());
}

function hideInfobox(e) {
pinInfobox.setOptions({
visible: false
});
}

function displayPinsOnMap(results) {
// Creates a collection to store multiple pins
var pins = new Microsoft.Maps.EntityCollection();

//Create the info box for pushpin
var infoboxOptions = {width: 260, height:160};
pinInfobox = new Microsoft.Maps.Infobox(new Microsoft.Maps.Location(0, 0), infoboxOptions);
infoboxLayer.push(pinInfobox);

// Create Pins
for (var i = 0; i < results.length; i++) {
//pushpin location
var position = new Microsoft.Maps.Location(results[i]["Lat"], results[i]["Lon"]);
//Create the pin
if(results[i]["DNC"] == 'DNC') {
var sppins = {htmlContent:"<img src='badsp.png' height='32px'> " };
} else {
var sppins = {htmlContent:"<img src='sppin.png' height='32px'> " };
}
var pin = new Microsoft.Maps.Pushpin(position, sppins);
pin.Title = results[i]["Business Name"];
pin.Description =results[i]["Address"] + "<br>" + 
  results[i]["City"] + ", " +
  results[i]["StateListing"] + "<br>" + 
  results[i]["Phone"] +
  "<br>Fax: " + results[i]["Fax"] +
  "<br>Email: " + results[i]["Email"];

Microsoft.Maps.Events.addHandler(pin, 'click', displayInfobox);

function pinclick(i) {
Microsoft.Maps.Events.addHandler(results[i], 'click');
}

//Add pin to the map
map.entities.push(pin);
}

//hide box on map move
Microsoft.Maps.Events.addHandler(map, 'viewchange', hideInfobox);


//add pins/infobox
map.entities.push(pinInfobox);
}

我有一个从JSON文件中提取并显示在地图上的项目列表。每个项目都会创建一个图钉和信息框以及一张桌子旁边的表格。我需要做的是点击我需要的表格中公司的名称来打开与该公司相关的信息框。以下是我过去使用Google API执行此操作的方式 - 这似乎对Bing没有相同的作用(是的,我必须使用bing)。

"<td>"+'<a href="#" onclick="javascript:displayInfobox(' + (i) + ');">' + results[i]["Business Name"] +'<\/a>' + "</td>"

1 个答案:

答案 0 :(得分:0)

看起来您已经从某些代码中复制了displayInfobox函数,当有人点击图钉时,该函数会被嘲弄,因为该函数具有以下代码:

pinInfobox.setLocation(e.target.getLocation());

Bing Maps pushpin对象上存在getLocation()方法,但显然不在你的上面,因此当它到达那一行时你会失败(你使用你的浏览器调试工具吗?)。您需要更改该行,以便从某处获取信息框的位置,方法是将lat lon作为您的某个属性,并使用这些属性构建新的Bing Maps位置对象,或者通过循环遍历所有引脚地图找到一个与你相匹配的地方

相关问题