Bing Map v8 - 取消选择选定的图钉事件
Bing Map v8 - deselect selected pushpin event
Bing 有 2 个图钉事件样式。
- 启用悬停样式:布尔值
- enableClickedStyle : 布尔值
转到下面的 link 查看这些 events/styles 的实际效果
http://www.bing.com/api/maps/sdk/mapcontrol/isdk#setPushpinOptions+JS
所以我想要完成的是在选择另一个引脚时取消选择一个已经选择的引脚。有办法吗?
已编辑:
我找到了一个解决方案,但不确定它是否是最佳的,但它是。
我在图钉点击时触发了事件
Microsoft.Maps.Events.addHandler(pushpin, 'click', togglePinState);
然后,togglePinState 函数
function togglePinState(pinData){
if(pinData.target == null)
return;
if(selectedPin == null){
selectedPin = pinData.target;
selectedPin.setOptions({enableClickedStyle: true});
return;
}
if(pinData.target != selectedPin){
selectedPin.setOptions({enableClickedStyle: false});
selectedPin = pinData.target;
selectedPin.setOptions({enableClickedStyle: true});
}
}
在使用 bing-v8 内置 eventStyles 时,我还没有看到任何代码解决这个特殊情况,所以我希望这对某人有所帮助。
这是比我原来 post 中的代码更新的代码。现在这对我来说非常好。除了它不允许您取消选择引脚。更新代码可以让你做到这一点,看下面。
function togglePinState(pinData){
if(pinData.target == null)
return;
if(selectedPin == null){
selectedPin = pinData.target;
PopulateSidePanel(selectedPin)
return;
}
// Checks if the pin that triggered the event is not equal to the selected pin if so, we change states of both pins.
if(pinData.target != selectedPin){
selectedPin.setOptions({enableClickedStyle: false});
selectedPin.setOptions({enableClickedStyle: true});
selectedPin = pinData.target;
PopulateSidePanel(selectedPin)
}
}
更新 1
添加了当您只想将当前选中状态切换为取消选中状态的功能。
function togglePinState(pinData){
// Just in case
if(pinData.target == null)
return;
// There is no selected Pin so we just assign the first pin to be the selectedPin
if(selectedPin == null){
selectedPin = pinData.target;
PopulateSidePanel(selectedPin)
return;
}
// Checks if the pin that triggered the event is not equal to the selected pin if so, we change states of both pins.
else if(pinData.target != selectedPin){
selectedPin.setOptions({enableClickedStyle: false});
selectedPin.setOptions({enableClickedStyle: true});
selectedPin = pinData.target;
PopulateSidePanel(selectedPin)
}
// if the pin that triggered the event is equal to the selected pin then we set everything to null.
else {
selectedPin = null;
PopulateSidePanel(null);
}
}
Bing 有 2 个图钉事件样式。
- 启用悬停样式:布尔值
- enableClickedStyle : 布尔值
转到下面的 link 查看这些 events/styles 的实际效果 http://www.bing.com/api/maps/sdk/mapcontrol/isdk#setPushpinOptions+JS
所以我想要完成的是在选择另一个引脚时取消选择一个已经选择的引脚。有办法吗?
已编辑:
我找到了一个解决方案,但不确定它是否是最佳的,但它是。
我在图钉点击时触发了事件
Microsoft.Maps.Events.addHandler(pushpin, 'click', togglePinState);
然后,togglePinState 函数
function togglePinState(pinData){
if(pinData.target == null)
return;
if(selectedPin == null){
selectedPin = pinData.target;
selectedPin.setOptions({enableClickedStyle: true});
return;
}
if(pinData.target != selectedPin){
selectedPin.setOptions({enableClickedStyle: false});
selectedPin = pinData.target;
selectedPin.setOptions({enableClickedStyle: true});
}
}
在使用 bing-v8 内置 eventStyles 时,我还没有看到任何代码解决这个特殊情况,所以我希望这对某人有所帮助。
这是比我原来 post 中的代码更新的代码。现在这对我来说非常好。除了它不允许您取消选择引脚。更新代码可以让你做到这一点,看下面。
function togglePinState(pinData){
if(pinData.target == null)
return;
if(selectedPin == null){
selectedPin = pinData.target;
PopulateSidePanel(selectedPin)
return;
}
// Checks if the pin that triggered the event is not equal to the selected pin if so, we change states of both pins.
if(pinData.target != selectedPin){
selectedPin.setOptions({enableClickedStyle: false});
selectedPin.setOptions({enableClickedStyle: true});
selectedPin = pinData.target;
PopulateSidePanel(selectedPin)
}
}
更新 1
添加了当您只想将当前选中状态切换为取消选中状态的功能。
function togglePinState(pinData){
// Just in case
if(pinData.target == null)
return;
// There is no selected Pin so we just assign the first pin to be the selectedPin
if(selectedPin == null){
selectedPin = pinData.target;
PopulateSidePanel(selectedPin)
return;
}
// Checks if the pin that triggered the event is not equal to the selected pin if so, we change states of both pins.
else if(pinData.target != selectedPin){
selectedPin.setOptions({enableClickedStyle: false});
selectedPin.setOptions({enableClickedStyle: true});
selectedPin = pinData.target;
PopulateSidePanel(selectedPin)
}
// if the pin that triggered the event is equal to the selected pin then we set everything to null.
else {
selectedPin = null;
PopulateSidePanel(null);
}
}