0

そのため、私には意味のない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として表示され、その後はfalseとして表示されます。

現時点では、この動作の原因について困惑しています。私はここで何が間違っているのですか？

4

1 に答える 1

2

これは、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();
于 2012-07-30T18:22:48.627 に答える