javascript - Javascript中随机数在一定范围内但排除一些

Question

我想通过自动生成创建点云。我对此没有问题，我使用随机函数来创建随机坐标。

// I used this function twice, for X coordinate and for Y coordinate
// min and max represent width and height intervals
function getRandom(min,max){
    return Math.floor(Math.random()*(max-min+1)+min);
}

但是，我想避免点太近。我想将所有点插入一个数组中，每次添加一个点时，我都会将这个点与数组中的所有其他点进行比较，以检查它们之间的距离，但我不确定这对于性能来说是个好主意。

你有想法这样做吗？您有一些脚本或其他资源可以帮助我吗？

提前致谢，

Answer 1

当您使用Math.floor时，我会假设它们是像素，也许是体素坐标。在这种情况下，您还可以将整个矩形/ block 存储在数组中，并通过在已选定位置周围绘制圆盘/球体来“禁用”已选定位置的附近。

带有 Canvas 的模型:

function magic(){
    var cnv=document.getElementById("cnv");
    var ctx=cnv.getContext("2d");
    ctx.clearRect(0,0,cnv.width,cnv.height);
    ctx.fillStyle="#D0D0D0";
    ctx.strokeStyle="#000000";
    var numdots=parseInt(document.getElementById("numdots").value);
    var mindist=parseInt(document.getElementById("mindist").value);
    var tries=0;
    for(var i=0;i<numdots;i++){
        var retry=true;
        while(retry){
            tries++;
            var x=Math.random()*cnv.width;
            var y=Math.random()*cnv.height;
            retry=ctx.getImageData(x,y,1,1).data[0]!==0;
        }
        ctx.beginPath();
        ctx.arc(x,y,mindist-2,0,Math.PI*2);
        ctx.fill();
        ctx.beginPath();
        ctx.arc(x,y,1,0,Math.PI*2);
        ctx.stroke();
    }
    document.getElementById("log").innerHTML=tries;
}
magic();

<input type="number" id="numdots" value="100">
<input type="number" id="mindist" value="20">
<button onclick="magic()">Do</button>
<span id="log"></span><br>
<canvas id="cnv" width="300" height="300"></canvas>

(第一个数字是您想要放置的点的数量，第二个数字是您想要在点之间保持的最小距离，最后出现的数字是放置所有点所花费的尝试次数点)

这个简短而缓慢，都是因为使用了 Canvas 和图像数据。使用简单的类型数组和 circle drawing 自己的实现它可能会更快、更长。