獲得較低的z-index以獲得更大的數字

Question

這是一個數學問題，而不是編碼問題。我正在創建一個散點圖，其中的氣泡大小也不同。 我希望較大的尺寸比較小的尺寸具有較低的z索引，以避免較大的尺寸站立在較小的尺寸上，從而無法進行交互。 因此，我需要一個公式通過代碼還原該順序。 謝謝

Answer 1

只需使用大小並將其設置為負數即可（ var zIndex = size * -1; ）。

編輯非負選項。

var zIndex = (1 / size) * 1000;

您可以根據自己的喜好調整1000 。 倒數將給出較小的正浮點值，適用於較大尺寸（將其保持在零以上）。 乘法為您提供了可以使用的數字。

Answer 2

如果您知道氣泡數，則可以從氣泡總數中取最大1和最小1入手。 另外，您可以使用負Z指標。

Answer 3

物有所值 ...

從性能的角度來看，最好的方法是在創建時計算並應用每個氣泡的zIndex。

如果這是不切實際或不可能的，則可以按以下步驟重新索引所有氣泡：

function reindex_bubbles() {
    var bubbleArr = $(".bubble").get().sort(function(a, b) {
        return b.width() - a.width();//or possibly the other way round?
    });
    $.each(bubbleArr, function(i, bubble) {
        bubble.attr('zIndex', i);
    });
}

我們在此假設.width()給出了氣泡大小的可靠度量。 如果不是，則替換其他表達式。