Cesium聚簇实现-kdbush类实现

上一篇讲了kdbush实现原理，本篇看下kdbush源码，了解其算法具体实现。

kdbush是一个开源js库，github地址：https://github.com/mourner/kdbush/

开发者除了开发了该库，还开发了另外几个空间搜索库，包括rbush，rbush-knn，geokdbush，相关的原理说明请参考：http://www.sohu.com/a/137533865_642762
若感兴趣的同学可自行查看。

kdbush js库整体说明

构造函数
function kdbush(points, getX, getY, nodeSize, ArrayType)
参数说明
points：所有要参加搜索的点集合
getX,getY:获取每个点的X和Y坐标函数引用
nodeSize:点个数
ArrayType:点坐标数据类型
公共函数
function range(minX, minY, maxX, maxY)
获取矩形框范围内所有点
参数：用矩形的最大最小xy值唯一确定一个矩形
function within(qx, qy, r)
获取圆形范围内所有点
qx，qy：圆心xy坐标
r:半径

初始化排序函数

function KDBush(points, getX, getY, nodeSize, ArrayType) {
    getX = getX || defaultGetX;
    getY = getY || defaultGetY;
    ArrayType = ArrayType || Array;

    this.nodeSize = nodeSize || 64;
    this.points = points;

    this.ids = new ArrayType(points.length);
    this.coords = new ArrayType(points.length * 2);

    for (var i = 0; i < points.length; i++) {
        this.ids[i] = i;
        this.coords[2 * i] = getX(points[i]);
        this.coords[2 * i + 1] = getY(points[i]);
    }

    sort(this.ids, this.coords, this.nodeSize, 0, this.ids.length - 1, 0);
}

首先将points点坐标全部放到coords数组中，用ids数组记录索引，然后用sort函数实现排序。
sort函数是一个递归函数，功能是将点坐标按照之前提到的kdbush方法重新排序，方便快速查找。

function sort(ids, coords, nodeSize, left, right, depth) {
    if (right - left <= nodeSize) return;

    var m = Math.floor((left + right) / 2);

    select(ids, coords, m, left, right, depth % 2);

    sort(ids, coords, nodeSize, left, m - 1, depth + 1);
    sort(ids, coords, nodeSize, m + 1, right, depth + 1);
}

  阅读这些经典算法的源代码，始终有一种如沐春风的感觉，函数优美地分离，程序清晰简洁，能看懂一眼就明白，看不懂地也一眼让你看出来，避免带你入坑太久，虐的你体无完肤再放你出来，好在如今一切看起来都是那么地自然清新。
  这里没什么好解释，代码自解释：找到中间索引点，调用一个select函数进行一番重排序操作，然后递归调用sort函数分别处理中间索引左侧和右侧序列，并且有一个参数depth标识它递归到哪一层，所以主要逻辑在函数select中。

function select(ids, coords, k, left, right, inc) {

    while (right > left) {
        if (right - left > 600) {
            var n = right - left + 1;
            var m = k - left + 1;
            var z = Math.log(n);
            var s = 0.5 * Math.exp(2 * z / 3);
            var sd = 0.5 * Math.sqrt(z * s * (n - s) / n) * (m - n / 2 < 0 ? -1 : 1);
            var newLeft = Math.max(left, Math.floor(k - m * s / n + sd));
            var newRight = Math.min(right, Math.floor(k + (n - m) * s / n + sd));
            select(ids, coords, k, newLeft, newRight, inc);
        }

        var t = coords[2 * k + inc];
        var i = left;
        var j = right;

        swapItem(ids, coords, left, k);
        if (coords[2 * right + inc] > t) swapItem(ids, coords, left, right);

        while (i < j) {
            swapItem(ids, coords, i, j);
            i++;
            j--;
            while (coords[2 * i + inc] < t) i++;
            while (coords[2 * j + inc] > t) j--;
        }

        if (coords[2 * left + inc] === t) swapItem(ids, coords, left, j);
        else {
            j++;
            swapItem(ids, coords, j, right);
        }

        if (j <= k) left = j + 1;
        if (k <= j) right = j - 1;
    }
}

  以上代码很好地展现了优秀代码的风格，比如在一开始进入循环的部分，有一段当right-left大于600的代码段，里面有很多数学公式，很明显这段代码本人看不懂，感谢作者在这里将其很好地与主程序隔离，让读者即使不去理会这一段也不影响整个程序的理解。
  接下来的程序就是通过不断交换数组元素达到生成符合要求的数组的目标，其中swapItem是交换函数，该函数交换了指定索引的点坐标和点索引，而每次调用select得到的新数列符合要求：在left和right中间索引点的x或者y坐标满足：其左边的所有点x或者y左边都小于等于该点对应坐标，其右边所有点的x或者y左边都大于等于该点对应坐标，至于用x还是用y来作为比较依据，那取决于当前的层级，也就是最后一个参数inc，层级为偶数为x，层级为奇数为y，层级从0开始。
整个算法总体思想：
将数列的中间点取出，放到数列的指定位置，使其满足在这个位置左边的所有值都小于等于该点值，右边的所有值都大于等于该点值，然后根据新位置和中间点关系来缩小查询范围，直到找到的新位置正好是中间位置为止。
如下图所示举例说明：

查询函数

矩形框范围查询

矩形框查询函数为range：

function range(ids, coords, minX, minY, maxX, maxY, nodeSize) {
    var stack = [0, ids.length - 1, 0];
    var result = [];
    var x, y;

    while (stack.length) {
        var axis = stack.pop();
        var right = stack.pop();
        var left = stack.pop();

        if (right - left <= nodeSize) {
            for (var i = left; i <= right; i++) {
                x = coords[2 * i];
                y = coords[2 * i + 1];
                if (x >= minX && x <= maxX && y >= minY && y <= maxY) result.push(ids[i]);
            }
            continue;
        }

        var m = Math.floor((left + right) / 2);

        x = coords[2 * m];
        y = coords[2 * m + 1];

        if (x >= minX && x <= maxX && y >= minY && y <= maxY) result.push(ids[m]);

        var nextAxis = (axis + 1) % 2;

        if (axis === 0 ? minX <= x : minY <= y) {
            stack.push(left);
            stack.push(m - 1);
            stack.push(nextAxis);
        }
        if (axis === 0 ? maxX >= x : maxY >= y) {
            stack.push(m + 1);
            stack.push(right);
            stack.push(nextAxis);
        }
    }

    return result;
}

代码相当简洁，其中判断条件即为：
if (x >= minX && x <= maxX && y >= minY && y <= maxY) result.push(ids[m]);
当前点的x坐标和y坐标值都分别在minx、maxx和miny、maxy之间。

前半部分是普通依次对比的算法，不用太在意，在cesium中调用nodeSize值为64，也就是一个点最多又64个子节点，在这64个点中搜索就采用依次搜索：

 if (right - left <= nodeSize) {
            for (var i = left; i <= right; i++) {
                x = coords[2 * i];
                y = coords[2 * i + 1];
                if (x >= minX && x <= maxX && y >= minY && y <= maxY) result.push(ids[i]);
            }
            continue;
        }

而后半部分是类似二分法查找，由于数据都在前面的排序算法中构成了树，所以这里只需要对比中间点，判断中间点对应的x或者y（具体是x还是y要看当前循环到哪一层，单数层是x，双数层是y）是大于minx或者miny还是小于maxx或者maxy，如果是前者，则将中间点的左侧点都加入下一轮比较，如果是后者，则将中间点的右侧点都加入下一轮比较，如果两者都满足，说明当前中间点本身就在查找范围内，这时候并不能确定其左侧点或者右侧点都不在查找范围，所以将本轮中间点的左右两侧点都加入下一轮比较。

圆形范围查询

圆形范围查询和矩形范围查询基本一致，方法为within：

function within(ids, coords, qx, qy, r, nodeSize) {
    var stack = [0, ids.length - 1, 0];
    var result = [];
    var r2 = r * r;

    while (stack.length) {
        var axis = stack.pop();
        var right = stack.pop();
        var left = stack.pop();

        if (right - left <= nodeSize) {
            for (var i = left; i <= right; i++) {
                if (sqDist(coords[2 * i], coords[2 * i + 1], qx, qy) <= r2) result.push(ids[i]);
            }
            continue;
        }

        var m = Math.floor((left + right) / 2);

        var x = coords[2 * m];
        var y = coords[2 * m + 1];

        if (sqDist(x, y, qx, qy) <= r2) result.push(ids[m]);

        var nextAxis = (axis + 1) % 2;

        if (axis === 0 ? qx - r <= x : qy - r <= y) {
            stack.push(left);
            stack.push(m - 1);
            stack.push(nextAxis);
        }
        if (axis === 0 ? qx + r >= x : qy + r >= y) {
            stack.push(m + 1);
            stack.push(right);
            stack.push(nextAxis);
        }
    }

    return result;
}

只是判断条件不同：
if (sqDist(coords[2 * i], coords[2 * i + 1], qx, qy) <= r2) result.push(ids[i]);
这里sqDist为勾股定理距离：

function sqDist(ax, ay, bx, by) {
    var dx = ax - bx;
    var dy = ay - by;
    return dx * dx + dy * dy;
}