单击信息框 - bing 地图 api
Onclick infobox - bing map api
我无法通过从地图外部单击打开 bing API 的信息框。
这是显示信息框函数和创建 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 文件中提取并显示在地图上的项目列表。每个项目都会创建一个图钉和信息框,并在 table 关闭到地图的一侧。我需要做的是点击 table 中的公司名称,我需要它来打开与该公司关联的信息框。这是我过去使用 Google API 的方式 - 这似乎与 Bing 的工作方式不同(是的,我必须使用 bing) .
"<td>"+'<a href="#" onclick="javascript:displayInfobox(' + (i) + ');">' + results[i]["Business Name"] +'<\/a>' + "</td>"
您似乎从某些代码中复制了 displayInfobox 函数,当有人单击图钉时,该函数会被触发,因为该函数具有以下代码:
pinInfobox.setLocation(e.target.getLocation());
Bing 地图图钉对象上存在 getLocation() 方法,但显然不在您的对象上,因此当它到达该行时它将失败(您使用浏览器调试工具对吗?)。您将需要更改该行,以便它获取信息框的位置以从某个地方显示,方法是将经纬度作为您的某个属性并使用这些对象构建新的 Bing 地图位置对象或循环遍历地图上的所有图钉以找到在某种程度上与您匹配的图钉
我无法通过从地图外部单击打开 bing API 的信息框。
这是显示信息框函数和创建 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 文件中提取并显示在地图上的项目列表。每个项目都会创建一个图钉和信息框,并在 table 关闭到地图的一侧。我需要做的是点击 table 中的公司名称,我需要它来打开与该公司关联的信息框。这是我过去使用 Google API 的方式 - 这似乎与 Bing 的工作方式不同(是的,我必须使用 bing) .
"<td>"+'<a href="#" onclick="javascript:displayInfobox(' + (i) + ');">' + results[i]["Business Name"] +'<\/a>' + "</td>"
您似乎从某些代码中复制了 displayInfobox 函数,当有人单击图钉时,该函数会被触发,因为该函数具有以下代码:
pinInfobox.setLocation(e.target.getLocation());
Bing 地图图钉对象上存在 getLocation() 方法,但显然不在您的对象上,因此当它到达该行时它将失败(您使用浏览器调试工具对吗?)。您将需要更改该行,以便它获取信息框的位置以从某个地方显示,方法是将经纬度作为您的某个属性并使用这些对象构建新的 Bing 地图位置对象或循环遍历地图上的所有图钉以找到在某种程度上与您匹配的图钉