高性能坐标系-Three.js

时间:2019-06-08 04:42:14

标签: javascript performance three.js coordinate-systems

概念性问题

我正在Three.js中构建一个飞行模拟器。我打算从Google Earth中提取纬度,经度和高程的CSV数据,并将其传输到arcGIS中以创建数字高程模型(DEM)。然后,我想基于DEM创建地形。我已经有一个编写的Splat贴图纹理着色器,而且一切看起来都很好。

但是,我需要为城镇添加模型,尤其是文本和着陆区。这将需要准确的XYZ坐标。

我认为这是一个有趣的问题。我之前在stackoverflow上已经看到了一个与此类似的问题,但它与我要寻找的深度并不完全相同。


1)如何创建将实际XYZ,纬度,经度,高程数据映射到PlaneBufferGeometry的坐标系?

我的假设是,如果我假设一个100,000 x 100,000的地图样本,那么我将需要创建一个具有匹配顶点数的Plane,然后映射1:1。

new THREE.PlaneBufferGeometry( 100000, 100000, 100000, 100000 );

然后将较长的坐标映射到此比较棘手。也许只是一个乘数,比如*每经度长度100左右?


2)如何为此创建最有效的数据结构。它将包含大量数据。

我认为最有效的数据结构是具有Z个整数的数组。

let vertArray = new Array(10000000000);

for (i = 0; i < 9999999999; i++) { 
  vertArray[i] = planeBufferGeometry.vertices[i].z;
}

数组中的每个100,000将代表一个Y坐标,而所述部分中的每个i值将是一个X坐标。 Z坐标的值将存储在数组本身中。

因此,假设我想获得X:3,Y:4,Z :?会是...

const xCoord = 3,
      yCoord = 4,
      index = (yCoord * 100000) + xCoord,
      zCoord = vertArray[index];

这是我能想到的最小的开销方法...提前定义数组长度,使数组保持一维,仅填充整数。还有更好的主意吗?也许不需要创建数组,而我可以创建一个方程,直接从渲染的网格中提取vert数据?


3)有什么方法可以减少存储在浏览器内存中的大数据的影响?

我还没有实现这一点,但是在我看来,在浏览器中使用1000万长度数组的想法很多。我更希望能够加载整个内容,而不是在直升机接近子平面的边缘时进行某种AJAX调用。在MMORPG的“区域”中思考。

0 个答案:

没有答案