我有一个函数,它接受经度和纬度并将其转换为要绘制的 x 和 y。到 X 和 Y 的转换工作正常,这不是我遇到的问题。
我想确保两个点不会绘制在同一个地方。在一组结果中,大约有 30 个相互重叠(因为它们具有相同的纬度和经度),这个数字可能会大很多。
目前,我正试图通过将点移动到点的左侧、右侧、顶部或底部以形成一个正方形来实现这一点。一旦绘制了一个由点组成的正方形,然后移动到下一行并在前一个正方形周围绘制另一个点正方形。
代码是 Javascript,但它非常通用,所以我想它有点无关紧要。
我的代码如下:
var prevLong, prevLat, rand = 1, line = 1, spread = 8, i = 0;
function plot_points(long, lat){
// CODE HERE TO CONVERT long and lat into x and y
// System to not overlap the points
if((prevLat == lat) && (prevLong == long)) {
if(rand==1) {
x += spread*line;
} else if(rand==2) {
x -= spread*line;
} else if(rand==3) {
y += spread*line;
} else if(rand==4) {
y -= spread*line;
} else if(rand==5) {
x += spread*line;
y += spread*line;
} else if(rand==6) {
x -= spread*line;
y -= spread*line;
} else if(rand==7) {
x += spread*line;
y -= spread*line;
} else if(rand==8) {
x -= spread*line;
y += spread*line;
// x = double
} else if(rand==9) {
x += spread*line;
y += spread;
} else if(rand==10) {
x += spread;
y += spread*line;
} else if(rand==11) {
x -= spread*line;
y -= spread;
} else if(rand==12) {
x -= spread;
y -= spread*line;
} else if(rand==13) {
x += spread*line;
y -= spread;
} else if(rand==14) {
x += spread;
y -= spread*line;
} else if(rand==15) {
x += spread*line;
y -= spread;
} else if(rand==16) {
x += spread;
y -= spread*line;
} else if(rand==17) {
x -= spread*line;
y += spread;
} else if(rand==18) {
x -= spread;
y += spread*line;
} else if(rand==19) {
x -= spread*line;
y += spread;
} else if(rand==20) {
x -= spread;
y += spread*line;
}
if(rand == 20) {rand = 1; line++; } else { rand++; }
i++
} else {
line = 1;
i = 0;
}
prevLat = latitude;
prevLong = longitude;
return [x,y];
}
这是输出:
它没有正常工作,我什至不知道我是否以正确的方式解决了这个问题。
有没有人必须这样做?您建议使用哪种方法?
最佳答案
首先对您的坐标进行分组。在最后一步之前,可能不需要进行 long,lat -> x,y 转换。一种方法是创建一个 HashMap ,您可以在其中存储每个长/纬度位置和每个位置的计数。
然后您将每个 long,lat 位置转换为 x,y 坐标,并使用计数来决定如何渲染以 x,y 位置为中心的点,但大小取决于点的数量。
渲染正方形的工作算法是:
var count = 30; // example
result = [];
var width = count/Math.sqrt(count);
width = Math.floor(width);
height = Math.floor(count/width);
var remain = count % width;
var i,j;
for(i = 0; i < width; i++)
for(j = 0; j < height; j++)
result.push([x-Math.floor(width/2)+i, y-Math.floor(height/2)+j];
for(i = 0; i < remain; i++)
result.push([x-Math.floor(width/2)+i, y-Math.floor(height/2)+j];
输入是点数,x,y 中心坐标,输出是要渲染的点数组。
最后一行是剩余的点,例如 15 点正方形渲染:
OOOO
OOOO
OOOO
OOO
关于javascript - 绘制点,以便它们在具有相同坐标时不会重叠,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2655155/