Question

所以我对raphael.js库有一个奇怪的问题对我没用。我有一张世界地图，上面有代表地点的点。许多点彼此重叠。当我想挑出不同的位置时，我想把元素带到前台。

鉴于以下代码......

$("#peerIdSelector").change(function() {
    var peerSelected = $(this).val();
    var counter = 0;
    var antiCounter = 0;
    paper.forEach(function (el) {
        var peer = el.data("peer");
        if (peer === peerSelected) {
            //el.toFront();
            el.attr("fill", "#ffff00");
            counter++;
         } else {
            el.attr("fill", "#00ffff" );
            antiCounter++;
         }
    });
    alert(counter + " peers updated for " +  peerSelected + "\n" + antiCounter + " peers not updated")
});

当el.toFront()被注释掉时，代码按预期工作，根据if语句查找正确数量的元素。但是，如果我包含el.toFront()指令，则只有遇到的第一个if (peer === peerSelected)将显示为true，之后的每个其他{{1}}将显示为false。

目前我很难过会导致这种行为。我在这里做错了什么？

Answer 1

这就是Raphael的forEach功能：

paperproto.forEach = function (callback, thisArg) {
    var bot = this.bottom;
    while (bot) {
        if (callback.call(thisArg, bot) === false) {
            return this;
        }
        bot = bot.next;
    }
    return this;
};

在当前项目上调用toFront会导致元素被移动到列表的末尾，因此bot.next将为null，而while循环将比您预期的更早开始。

我建议将其作为解决方案：

var frontSet = paper.set();
paper.forEach(function (el) {
    var peer = el.data("peer");
    if (peer === peerSelected) {
        frontSet.push( el );
        el.attr("fill", "#ffff00");
        counter++;
     } else {
        el.attr("fill", "#00ffff" );
        antiCounter++;
     }
});
frontSet.toFront();

Raphael toFront（）古怪

1 个答案: