Skip to content

Commit

Permalink
line fatline path extrudeline etc support coordinate.z (#610)
Browse files Browse the repository at this point in the history
  • Loading branch information
@deyihu
deyihu authored Aug 21, 2023
1 parent 1135ceb commit 5eaa441
Show file tree
Hide file tree
Showing 6 changed files with 87 additions and 27 deletions.
36 changes: 33 additions & 3 deletions src/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -85,7 +85,8 @@ const EVENTS = [
];
const TEMP_COORD = new maptalks.Coordinate(0, 0);
const TEMP_POINT = new maptalks.Point(0, 0);

const TEMP_VECTOR3 = new THREE.Vector3();
const heightCache = new Map();
const KEY_FBO = '__webglFramebuffer';

// const MATRIX4 = new THREE.Matrix4();
Expand Down Expand Up @@ -174,6 +175,24 @@ class ThreeLayer extends maptalks.CanvasLayer {
drawOnInteracting(gl, view, scene, camera, event, timeStamp, context) {
this.renderScene(context, this);
}

/**
* transform height to glpoint
* @param enableHeight
* @param height
* @returns
*/
_transformHeight(enableHeight: boolean, height: number) {
if (!enableHeight) {
return 0;
}
height = height || 0;
if (height === 0) {
return 0;
}
const v = this.altitudeToVector3(height, height, null, TEMP_VECTOR3);
return v.x;
}
/**
* Convert a geographic coordinate to THREE Vector3
* @param {maptalks.Coordinate} coordinate - coordinate
Expand Down Expand Up @@ -202,7 +221,7 @@ class ThreeLayer extends maptalks.CanvasLayer {
return new THREE.Vector3(p.x, p.y, z);
}

coordinatiesToGLFloatArray(coordinaties: Array<maptalks.Coordinate | Array<number>>, centerPt: THREE.Vector3): {
coordinatiesToGLFloatArray(coordinaties: Array<maptalks.Coordinate | Array<number>>, centerPt: THREE.Vector3, hasHeight?: boolean): {
positions: Float32Array,
positons2d: Float32Array
} {
Expand All @@ -214,6 +233,7 @@ class ThreeLayer extends maptalks.CanvasLayer {
const len = coordinaties.length;
const array = new Float32Array(len * 2);
const array3d = new Float32Array(len * 3);
heightCache.clear();
for (let i = 0; i < len; i++) {
let coordinate = coordinaties[i];
const isArray = Array.isArray(coordinate);
Expand All @@ -230,10 +250,20 @@ class ThreeLayer extends maptalks.CanvasLayer {
array[idx] = p.x;
array[idx + 1] = p.y;

const coord = (coordinate as any);
let height = coord.z || coord[2] || 0;
if (hasHeight && !heightCache.has(height)) {
const z = this._transformHeight(hasHeight, height);
heightCache.set(height, z);
}
let z = 0;
if (hasHeight) {
z = heightCache.get(height) || 0;
}
const idx1 = i * 3
array3d[idx1] = p.x;
array3d[idx1 + 1] = p.y;
array3d[idx1 + 2] = 0;
array3d[idx1 + 2] = z;

}
return {
Expand Down
26 changes: 17 additions & 9 deletions src/util/LineUtil.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,8 @@ import { ThreeLayer } from './../index';
import { GeoJSONLineStringFeature, LineStringType, MergeAttributeType, SingleLineStringType } from './../type/index';
import { coordiantesToArrayBuffer } from '.';
const COMMA = ',';
const heightCache = new Map();
const TEMP_VECTOR3 = new THREE.Vector3();

/**
*
Expand Down Expand Up @@ -44,14 +46,20 @@ export function getLinePosition(lineString: SingleLineStringType | Array<THREE.V
}
const centerPt = layer.coordinateToVector3(center || cent);
if (hasVectorArray) {
heightCache.clear();
for (let i = 0, len = coordinates.length; i < len; i++) {
const coordinate = coordinates[i];
const height = coordinate.z || coordinate[2] || 0;
if (!heightCache.has(height)) {
const vz = layer.altitudeToVector3(height, height, null, TEMP_VECTOR3).x;
heightCache.set(height, vz);
}
const v = layer.coordinateToVector3(coordinate, z).sub(centerPt);
// positions.push(v.x, v.y, v.z);
v.z += (heightCache.get(height) || 0);
positionsV.push(v);
}
} else {
const result = layer.coordinatiesToGLFloatArray(coordinates, centerPt);
const result = layer.coordinatiesToGLFloatArray(coordinates, centerPt, true);
positions = result.positions;
positions2d = result.positons2d;
}
Expand All @@ -61,7 +69,7 @@ export function getLinePosition(lineString: SingleLineStringType | Array<THREE.V
positions,
positionsV,
positions2d,
arrayBuffer: positions2d.buffer
arrayBuffer: positions.buffer
}
}
positions2d = new Float32Array(positionsV.length * 2);
Expand All @@ -81,7 +89,7 @@ export function getLinePosition(lineString: SingleLineStringType | Array<THREE.V
positions,
positionsV,
positions2d,
arrayBuffer: positions2d.buffer
arrayBuffer: positions.buffer
};
}

Expand Down Expand Up @@ -185,7 +193,7 @@ export function getExtrudeLineParams(lineString: SingleLineStringType | Array<TH
const ps = [];
for (let i = 0, len = positions.length; i < len; i++) {
const p = positions[i];
ps.push([p.x, p.y]);
ps.push([p.x, p.y, p.z]);
}
const {
indices,
Expand Down Expand Up @@ -217,7 +225,7 @@ export function getPathParams(lineString: SingleLineStringType | Array<THREE.Vec
const ps = [];
for (let i = 0, len = positions.length; i < len; i++) {
const p = positions[i];
ps.push([p.x, p.y]);
ps.push([p.x, p.y, p.z]);
}
const {
indices,
Expand Down Expand Up @@ -308,11 +316,11 @@ export function mergeLinePositions(positionsList: Array<Float32Array>): Float32A

}

export function getLineArrayBuffer(lineString: SingleLineStringType): ArrayBuffer {
export function getLineArrayBuffer(lineString: SingleLineStringType, layer: ThreeLayer): ArrayBuffer {
if (lineString instanceof maptalks.LineString) {
return coordiantesToArrayBuffer(lineString.getCoordinates());
return coordiantesToArrayBuffer(lineString.getCoordinates(), layer);
} else if (isGeoJSONLine(lineString)) {
return coordiantesToArrayBuffer(lineString.geometry.coordinates);
return coordiantesToArrayBuffer(lineString.geometry.coordinates, layer);
}
}

Expand Down
24 changes: 20 additions & 4 deletions src/util/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -88,22 +88,38 @@ export function getGeometriesColorArray(geometriesAttributes): Float32Array {
}
return new Float32Array(colorsLen * 3);
}
const TEMP_VECTOR3 = new THREE.Vector3();
const heightCache = new Map();

export function coordiantesToArrayBuffer(coordiantes = []): ArrayBuffer {
export function coordiantesToArrayBuffer(coordiantes = [], layer?: ThreeLayer): ArrayBuffer {
const len = coordiantes.length;
const array = new Float64Array(len * 2);
const hasHeight = !!layer;
const dimensional = hasHeight ? 3 : 2;
const array = new Float64Array(len * dimensional);
heightCache.clear();
for (let i = 0; i < len; i++) {
let x, y;
const c = coordiantes[i];
let height;
if (c.x) {
x = c.x;
y = c.y;
height = c.z;
} else {
x = c[0];
y = c[1];
height = c[2];
}
array[i * dimensional] = x;
array[i * dimensional + 1] = y;
height = height || 0;
if (hasHeight && height !== 0) {
if (!heightCache.has(height)) {
const z = layer.altitudeToVector3(height, height, null, TEMP_VECTOR3).x;
heightCache.set(height, z);
}
array[i * dimensional + 2] = heightCache.get(height);
}
array[i * 2] = x;
array[i * 2 + 1] = y;
}
return array.buffer;
}
Expand Down
4 changes: 2 additions & 2 deletions src/worker/MeshActor.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -210,7 +210,7 @@ function gengerateExtrudeLines(lineStringList: Array<Array<SingleLineStringType>
const lineString = multiLineString[j];
let arrayBuffer: ArrayBuffer;
if (isMercator) {
arrayBuffer = getLineArrayBuffer(lineString);
arrayBuffer = getLineArrayBuffer(lineString, layer);
} else {
arrayBuffer = getLinePosition(lineString, layer, center, false).arrayBuffer;
}
Expand Down Expand Up @@ -276,7 +276,7 @@ function gengerateLines(lineStringList: Array<Array<SingleLineStringType>>, cent
for (let j = 0, len1 = multiLineString.length; j < len1; j++) {
const lineString = multiLineString[j];
if (isMercator) {
const arrayBuffer = getLineArrayBuffer(lineString);
const arrayBuffer = getLineArrayBuffer(lineString, layer);
transfer.push(arrayBuffer);
data.push(arrayBuffer);
} else {
Expand Down
2 changes: 1 addition & 1 deletion src/worker/getworker.ts
View file

Large diffs are not rendered by default.

22 changes: 14 additions & 8 deletions src/worker/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ export const onmessage = function (message, postResponse) {
} else if (type === 'ExtrudeLines' || type === 'Paths') {
for (let i = 0, len = datas.length; i < len; i++) {
for (let j = 0, len1 = datas[i].data.length; j < len1; j++) {
datas[i].data[j] = arrayBufferToArray(datas[i].data[j], datas[i].center || center, glRes, matrix);
datas[i].data[j] = arrayBufferToArray(datas[i].data[j], datas[i].center || center, glRes, matrix, true);
}
}
const result = generateExtrude(datas, type === 'ExtrudeLines' ? EXTRUDELINES : EXPANDPATHS);
Expand All @@ -43,7 +43,7 @@ export const onmessage = function (message, postResponse) {
for (let i = 0, len = datas.length; i < len; i++) {
const positionList = [];
for (let j = 0, len1 = datas[i].data.length; j < len1; j++) {
datas[i].data[j] = arrayBufferToArray(datas[i].data[j], datas[i].center || center, glRes, matrix);
datas[i].data[j] = arrayBufferToArray(datas[i].data[j], datas[i].center || center, glRes, matrix, true);
const array = lineArrayToFloatArray(datas[i].data[j]);
positionList.push(getLineSegmentPosition(array));
}
Expand All @@ -62,7 +62,7 @@ export const onmessage = function (message, postResponse) {
for (let i = 0, len = datas.length; i < len; i++) {
let psCount = 0;
for (let j = 0, len1 = datas[i].data.length; j < len1; j++) {
datas[i].data[j] = arrayBufferToArray(datas[i].data[j], datas[i].center || center, glRes, matrix);
datas[i].data[j] = arrayBufferToArray(datas[i].data[j], datas[i].center || center, glRes, matrix, true);
const array = lineArrayToFloatArray(datas[i].data[j]);
setBottomHeight(array, datas[i].bottomHeight);
psCount += (array.length / 3 * 2 - 2);
Expand Down Expand Up @@ -104,7 +104,7 @@ export const onmessage = function (message, postResponse) {
} else if (type === 'ExtrudeLine' || type === 'Path') {
for (let i = 0, len = datas.length; i < len; i++) {
for (let j = 0, len1 = datas[i].data.length; j < len1; j++) {
datas[i].data[j] = arrayBufferToArray(datas[i].data[j], datas[i].center || center, glRes, matrix);
datas[i].data[j] = arrayBufferToArray(datas[i].data[j], datas[i].center || center, glRes, matrix, true);
}
}
const lines = [], transfer = [];
Expand Down Expand Up @@ -170,16 +170,17 @@ function generateData(list, center, glRes, matrix) {



function arrayBufferToArray(buffer, center, glRes, matrix) {
function arrayBufferToArray(buffer, center, glRes, matrix, hasHeight) {
let ps;
if (glRes) {
ps = new Float64Array(buffer);
} else {
ps = new Float32Array(buffer);
}
const vs = [];
for (let i = 0, len = ps.length; i < len; i += 2) {
let x = ps[i], y = ps[i + 1];
const dimensional = hasHeight ? 3 : 2;
for (let i = 0, len = ps.length; i < len; i += dimensional) {
let x = ps[i], y = ps[i + 1], z = ps[i + 2];
if (center && glRes && matrix) {
TEMP_COORD.x = x;
TEMP_COORD.y = y;
Expand All @@ -200,7 +201,11 @@ function arrayBufferToArray(buffer, center, glRes, matrix) {
y -= center[1];

}
vs.push([x, y]);
if (hasHeight) {
vs.push([x, y, z]);
} else {
vs.push([x, y]);
}
}
return vs;
}
Expand Down Expand Up @@ -454,6 +459,7 @@ function lineArrayToFloatArray(coordinates = []) {
const idx = i * 3;
array[idx] = c[0];
array[idx + 1] = c[1];
array[idx + 2] = c[2] || 0;
}
return array;
}
Expand Down

0 comments on commit 5eaa441

Please sign in to comment.