Bing地图v8事件传递不正确的pin?

时间:2017-02-09 23:16:43

标签: javascript bing-maps

所以我正在使用bing maps v8编写应用程序。不幸的是,它没有z-index支持(尽管有z-index函数......)。所以我试图用层来完成类似的事情。问题是当我在层之间交换引脚时,事件开始在正确的引脚位置触发错误的元数据。

以下是我创建引脚的方法

function createImagePin(location, index, objArray)
{
    var obj = objArray[index];
    var smallPin = getSmallPin(obj);

    var pin = new Microsoft.Maps.Pushpin(location,
    {
        visible: true,
        icon: smallPin.data,
        anchor: new Microsoft.Maps.Point(smallPin.width / 2, smallPin.height / 2) //Align center of pushpin with location.
    });

    pin.metadata = {};
    pin.metadata.index = index;
    pin.metadata.dataTarget = obj;
    pin.metadata.isSelected = false;

    Microsoft.Maps.Events.addHandler(pin, 'click', function (e) {

        if(e.targetType === 'pushpin')
        {
            SetRowSelection(e.target.metadata.index);
        }
    });

    Microsoft.Maps.Events.addHandler(pin, 'mouseover', function (e)
    {
        if(e.targetType === 'pushpin')
        {
            SelectPin(e.target); 
            ShowInfobox(e.target);
            console.log(e.target.getLocation());
        }
    });

    Microsoft.Maps.Events.addHandler(pin, 'mouseout', function (e)
    {
        if (e.targetType === 'pushpin')
        {
            DeselectPin(e.target);
            HideInfobox();
        }
    });

    return pin;
}

出于某种原因,每次具有正确的位置但不正确的元数据时,我会在鼠标悬停中获取pin对象。如果我发表评论取消选择......我得到了正确的答案。

以下是我选择和取消选择引脚的方法。根据这个例子,我得到了Bing Maps pushpin icon issues

此刻没有其他代码触及这些引脚......这对我来说似乎很奇怪。它几乎就像在内部一样,只是在Layer中复制一些信息,而不是移动附加到对象的所有项目。事实上,如果我只是注释掉添加/删除它会停止传递我不正确的数据...虽然我丢失了我的z-indexing。

function SelectPin(pin)
{
    switch (pin.metadata.dataTarget.ComparableType)
    {
        case "Subject":
            mapLayers.subjectLayer.remove(pin);
            pin.setOptions({ visible: true, icon: largeGreenHouse.data, anchor: new Microsoft.Maps.Point(largeGreenHouse.width / 2, largeGreenHouse.height / 2) });
            break;
        case "Listing Comp":
            mapLayers.compLayer.remove(pin);
            pin.setOptions({ visible: true, icon: largeBlueHouse.data, anchor: new Microsoft.Maps.Point(largeBlueHouse.width / 2, largeBlueHouse.height / 2) });
            break;
        case "Sales Comp":
            mapLayers.compLayer.remove(pin);
            pin.setOptions({ visible: true, icon: largeBlueHouse.data, anchor: new Microsoft.Maps.Point(largeBlueHouse.width / 2, largeBlueHouse.height / 2) });
            break;
        case "Hidden":
            pin.setOptions({ visible: false });
            return;
        default:
            mapLayers.observableLayer.remove(pin);
            pin.setOptions({ visible: true, icon: largeGreyHouse.data, anchor: new Microsoft.Maps.Point(largeGreyHouse.width / 2, largeGreyHouse.height / 2) });
            break;
    }

    mapLayers.selectionLayer.add(pin);
    pin.metadata.isSelected = true;
}

function DeselectPin(pin)
{
    if(!pin.metadata.isSelected)
        return;

    pin.metadata.isSelected = false;
    mapLayers.selectionLayer.remove(pin);  
    switch (pin.metadata.dataTarget.ComparableType)
    {
        case "Subject":
            pin.setOptions({ visible: true, icon: greenHouse.data, anchor: new Microsoft.Maps.Point(greenHouse.width / 2, greenHouse.height / 2) });
            mapLayers.subjectLayer.add(pin);
            break;
        case "Listing Comp":
            pin.setOptions({ visible: true, icon: blueHouse.data, anchor: new Microsoft.Maps.Point(blueHouse.width / 2, blueHouse.height / 2) });
            mapLayers.compLayer.add(pin);
            break;
        case "Sales Comp":
            pin.setOptions({ visible: true, icon: blueHouse.data, anchor: new Microsoft.Maps.Point(blueHouse.width / 2, blueHouse.height / 2) });
            mapLayers.compLayer.add(pin);
            break;
        case "Hidden":
            pin.setOptions({ visible: false });
            return;
        default:
            pin.setOptions({ visible: true, icon: greyHouse.data, anchor: new Microsoft.Maps.Point(greyHouse.width / 2, greyHouse.height / 2) });
            mapLayers.observableLayer.add(pin);
            break;
    }

1 个答案:

答案 0 :(得分:0)

嗯,这似乎是一个数据问题,而不是代码问题。对于某些不具有相同地址的属性,我的数据会被编码为相同的纬度/经度。因此,阵列的重新排列导致不同的阵列具有相同的位置以获得顶部位置'。