geolba/GeotiefExplore
2
1
Fork 0
Code Issues 7 Pull Requests Projects 1 Releases Wiki Activity

- order of stencilMeshes

Browse Source
This commit is contained in:
Arno Kaimbacher 2021-07-01 23:32:44 +02:00
parent 0ba91f51c1
commit e27fcaddb2
6 changed files with 237 additions and 216 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

122
package-lock.json generated
View File

@ -12,7 +12,6 @@
"@fortawesome/fontawesome-free": "^5.15.2",
"@types/three": "^0.129.1",
"bulma": "^0.9.2",
"concaveman": "github:grassick/concaveman#patch-1",
"hull.js": "^0.2.11",
"lodash": "^4.17.21",
"normalize.css": "^8.0.1",
@ -2536,17 +2535,6 @@
"integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=",
"dev": true
},
"node_modules/concaveman": {
"version": "1.2.0",
"resolved": "git+ssh://git@github.com/grassick/concaveman.git#05682dcd7c21ef09f391e814d0f5df7cfbc3bbae",
"license": "ISC",
"dependencies": {
"point-in-polygon": "^1.0.1",
"rbush": "^3.0.0",
"robust-predicates": "^2.0.4",
"tinyqueue": "^2.0.3"
}
},
"node_modules/concurrently": {
"version": "6.2.0",
"resolved": "https://registry.npmjs.org/concurrently/-/concurrently-6.2.0.tgz",
@ -2671,9 +2659,9 @@
}
},
"node_modules/core-js-compat": {
"version": "3.15.1",
"resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.15.1.tgz",
"integrity": "sha512-xGhzYMX6y7oEGQGAJmP2TmtBLvR4nZmRGEcFa3ubHOq5YEp51gGN9AovVa0AoujGZIq+Wm6dISiYyGNfdflYww==",
"version": "3.15.2",
"resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.15.2.tgz",
"integrity": "sha512-Wp+BJVvwopjI+A1EFqm2dwUmWYXrvucmtIB2LgXn/Rb+gWPKYxtmb4GKHGKG/KGF1eK9jfjzT38DITbTOCX/SQ==",
"dev": true,
"dependencies": {
"browserslist": "^4.16.6",
@ -2933,9 +2921,9 @@
}
},
"node_modules/electron-to-chromium": {
"version": "1.3.760",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.760.tgz",
"integrity": "sha512-XPKwjX6pHezJWB4FLVuSil9gGmU6XYl27ahUwEHODXF4KjCEB8RuIT05MkU1au2Tdye57o49yY0uCMK+bwUt+A==",
"version": "1.3.762",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.762.tgz",
"integrity": "sha512-LehWjRpfPcK8F1Lf/NZoAwWLWnjJVo0SZeQ9j/tvnBWYcT99qDqgo4raAfS2oTKZjPrR/jxruh85DGgDUmywEA==",
"dev": true
},
"node_modules/emoji-regex": {
@ -4807,11 +4795,6 @@
"node": ">=8"
}
},
"node_modules/point-in-polygon": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/point-in-polygon/-/point-in-polygon-1.1.0.tgz",
"integrity": "sha512-3ojrFwjnnw8Q9242TzgXuTD+eKiutbzyslcq1ydfu82Db2y+Ogbmyrkpv0Hgj31qwT3lbS9+QAAO/pIQM35XRw=="
},
"node_modules/postcss": {
"version": "8.3.5",
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.3.5.tgz",
@ -4977,11 +4960,6 @@
"node": ">=8"
}
},
"node_modules/quickselect": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/quickselect/-/quickselect-2.0.0.tgz",
"integrity": "sha512-RKJ22hX8mHe3Y6wH/N3wCM6BWtjaxIyyUIkpHOvfFnxdI4yD4tBXEBKSbriGujF6jnSVkJrffuo6vxACiSSxIw=="
},
"node_modules/randombytes": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz",
@ -4991,14 +4969,6 @@
"safe-buffer": "^5.1.0"
}
},
"node_modules/rbush": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/rbush/-/rbush-3.0.1.tgz",
"integrity": "sha512-XRaVO0YecOpEuIvbhbpTrZgoiI6xBlz6hnlr6EHhd+0x9ase6EmeN+hdwwUaJvLcsFFQ8iWVF1GAK1yB0BWi0w==",
"dependencies": {
"quickselect": "^2.0.0"
}
},
"node_modules/read-pkg": {
"version": "5.2.0",
"resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-5.2.0.tgz",
@ -5404,11 +5374,6 @@
"url": "https://github.com/sponsors/isaacs"
}
},
"node_modules/robust-predicates": {
"version": "2.0.4",
"resolved": "https://registry.npmjs.org/robust-predicates/-/robust-predicates-2.0.4.tgz",
"integrity": "sha512-l4NwboJM74Ilm4VKfbAtFeGq7aEjWL+5kVFcmgFA2MrdnQWx9iE/tUGvxY5HyMI7o/WpSIUFLbC5fbeaHgSCYg=="
},
"node_modules/run-parallel": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz",
@ -5467,6 +5432,9 @@
"lodash": "^4.0.0",
"scss-tokenizer": "^0.2.3",
"yargs": "^13.3.2"
},
"bin": {
"sassgraph": "bin/sassgraph"
}
},
"node_modules/sass-graph/node_modules/ansi-regex": {
@ -5868,6 +5836,11 @@
"safer-buffer": "^2.0.2",
"tweetnacl": "~0.14.0"
},
"bin": {
"sshpk-conv": "bin/sshpk-conv",
"sshpk-sign": "bin/sshpk-sign",
"sshpk-verify": "bin/sshpk-verify"
},
"engines": {
"node": ">=0.10.0"
}
@ -6116,11 +6089,6 @@
"three": ">= 0.125.0"
}
},
"node_modules/tinyqueue": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tinyqueue/-/tinyqueue-2.0.3.tgz",
"integrity": "sha512-ppJZNDuKGgxzkHihX8v9v9G5f+18gzaTfrukGrq6ueg0lmH4nqVnA2IPG0AEH3jKEk2GRJCUhDoqpoiw3PHLBA=="
},
"node_modules/to-fast-properties": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz",
@ -6415,9 +6383,9 @@
}
},
"node_modules/webpack": {
"version": "5.41.0",
"resolved": "https://registry.npmjs.org/webpack/-/webpack-5.41.0.tgz",
"integrity": "sha512-pCVO7hVm8XiL6DpPtXrFLS8ktmH/tpvtbEex6hn4RweTFe6z6Cugh5FlQoEPZotb15HiirjM2Kv7THTA7sKLzQ==",
"version": "5.41.1",
"resolved": "https://registry.npmjs.org/webpack/-/webpack-5.41.1.tgz",
"integrity": "sha512-AJZIIsqJ/MVTmegEq9Tlw5mk5EHdGiJbDdz9qP15vmUH+oxI1FdWcL0E9EO8K/zKaRPWqEs7G/OPxq1P61u5Ug==",
"dev": true,
"dependencies": {
"@types/eslint-scope": "^3.7.0",
@ -8669,16 +8637,6 @@
"integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=",
"dev": true
},
"concaveman": {
"version": "git+ssh://git@github.com/grassick/concaveman.git#05682dcd7c21ef09f391e814d0f5df7cfbc3bbae",
"from": "concaveman@github:grassick/concaveman#patch-1",
"requires": {
"point-in-polygon": "^1.0.1",
"rbush": "^3.0.0",
"robust-predicates": "^2.0.4",
"tinyqueue": "^2.0.3"
}
},
"concurrently": {
"version": "6.2.0",
"resolved": "https://registry.npmjs.org/concurrently/-/concurrently-6.2.0.tgz",
@ -8774,9 +8732,9 @@
}
},
"core-js-compat": {
"version": "3.15.1",
"resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.15.1.tgz",
"integrity": "sha512-xGhzYMX6y7oEGQGAJmP2TmtBLvR4nZmRGEcFa3ubHOq5YEp51gGN9AovVa0AoujGZIq+Wm6dISiYyGNfdflYww==",
"version": "3.15.2",
"resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.15.2.tgz",
"integrity": "sha512-Wp+BJVvwopjI+A1EFqm2dwUmWYXrvucmtIB2LgXn/Rb+gWPKYxtmb4GKHGKG/KGF1eK9jfjzT38DITbTOCX/SQ==",
"dev": true,
"requires": {
"browserslist": "^4.16.6",
@ -8961,9 +8919,9 @@
}
},
"electron-to-chromium": {
"version": "1.3.760",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.760.tgz",
"integrity": "sha512-XPKwjX6pHezJWB4FLVuSil9gGmU6XYl27ahUwEHODXF4KjCEB8RuIT05MkU1au2Tdye57o49yY0uCMK+bwUt+A==",
"version": "1.3.762",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.762.tgz",
"integrity": "sha512-LehWjRpfPcK8F1Lf/NZoAwWLWnjJVo0SZeQ9j/tvnBWYcT99qDqgo4raAfS2oTKZjPrR/jxruh85DGgDUmywEA==",
"dev": true
},
"emoji-regex": {
@ -10353,11 +10311,6 @@
"find-up": "^4.0.0"
}
},
"point-in-polygon": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/point-in-polygon/-/point-in-polygon-1.1.0.tgz",
"integrity": "sha512-3ojrFwjnnw8Q9242TzgXuTD+eKiutbzyslcq1ydfu82Db2y+Ogbmyrkpv0Hgj31qwT3lbS9+QAAO/pIQM35XRw=="
},
"postcss": {
"version": "8.3.5",
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.3.5.tgz",
@ -10467,11 +10420,6 @@
"integrity": "sha512-ARhCpm70fzdcvNQfPoy49IaanKkTlRWF2JMzqhcJbhSFRZv7nPTvZJdcY7301IPmvW+/p0RgIWnQDLJxifsQ7g==",
"dev": true
},
"quickselect": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/quickselect/-/quickselect-2.0.0.tgz",
"integrity": "sha512-RKJ22hX8mHe3Y6wH/N3wCM6BWtjaxIyyUIkpHOvfFnxdI4yD4tBXEBKSbriGujF6jnSVkJrffuo6vxACiSSxIw=="
},
"randombytes": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz",
@ -10481,14 +10429,6 @@
"safe-buffer": "^5.1.0"
}
},
"rbush": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/rbush/-/rbush-3.0.1.tgz",
"integrity": "sha512-XRaVO0YecOpEuIvbhbpTrZgoiI6xBlz6hnlr6EHhd+0x9ase6EmeN+hdwwUaJvLcsFFQ8iWVF1GAK1yB0BWi0w==",
"requires": {
"quickselect": "^2.0.0"
}
},
"read-pkg": {
"version": "5.2.0",
"resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-5.2.0.tgz",
@ -10806,11 +10746,6 @@
"glob": "^7.1.3"
}
},
"robust-predicates": {
"version": "2.0.4",
"resolved": "https://registry.npmjs.org/robust-predicates/-/robust-predicates-2.0.4.tgz",
"integrity": "sha512-l4NwboJM74Ilm4VKfbAtFeGq7aEjWL+5kVFcmgFA2MrdnQWx9iE/tUGvxY5HyMI7o/WpSIUFLbC5fbeaHgSCYg=="
},
"run-parallel": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz",
@ -11348,11 +11283,6 @@
"integrity": "sha512-9wDhf1FOkXJ70JfsnQxuIFi997TRYGP+AWCEiJchxPy6mQysRdQOXgeym07JahkOB83YSTULOr/5hV6Lx2kXPA==",
"requires": {}
},
"tinyqueue": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/tinyqueue/-/tinyqueue-2.0.3.tgz",
"integrity": "sha512-ppJZNDuKGgxzkHihX8v9v9G5f+18gzaTfrukGrq6ueg0lmH4nqVnA2IPG0AEH3jKEk2GRJCUhDoqpoiw3PHLBA=="
},
"to-fast-properties": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz",
@ -11570,9 +11500,9 @@
}
},
"webpack": {
"version": "5.41.0",
"resolved": "https://registry.npmjs.org/webpack/-/webpack-5.41.0.tgz",
"integrity": "sha512-pCVO7hVm8XiL6DpPtXrFLS8ktmH/tpvtbEex6hn4RweTFe6z6Cugh5FlQoEPZotb15HiirjM2Kv7THTA7sKLzQ==",
"version": "5.41.1",
"resolved": "https://registry.npmjs.org/webpack/-/webpack-5.41.1.tgz",
"integrity": "sha512-AJZIIsqJ/MVTmegEq9Tlw5mk5EHdGiJbDdz9qP15vmUH+oxI1FdWcL0E9EO8K/zKaRPWqEs7G/OPxq1P61u5Ug==",
"dev": true,
"requires": {
"@types/eslint-scope": "^3.7.0",

1
package.json
View File

@ -7,7 +7,6 @@
"@fortawesome/fontawesome-free": "^5.15.2",
"@types/three": "^0.129.1",
"bulma": "^0.9.2",
"concaveman": "github:grassick/concaveman#patch-1",
"hull.js": "^0.2.11",
"lodash": "^4.17.21",
"normalize.css": "^8.0.1",

80
src/js/clip/material.js
View File

@ -1,80 +0,0 @@
import { MeshBasicMaterial } from 'three/src/materials/MeshBasicMaterial';
import { LineBasicMaterial } from 'three/src/materials/LineBasicMaterial';
import { ShaderMaterial } from 'three/src/materials/ShaderMaterial';
import { uniforms } from "./uniforms";
import { shader } from './shader';
import { DoubleSide, BackSide, FrontSide } from 'three/src/constants';
import { DecrementWrapStencilOp, IncrementWrapStencilOp } from 'three/src/constants';
import { NotEqualStencilFunc, ReplaceStencilOp, AlwaysStencilFunc } from 'three/src/constants';
let profileMaterial = new ShaderMaterial({
color: 0xE91E63,
// metalness: 0.1,
// roughness: 0.75,
// flatShading: true,
stencilWrite: true,
// stencilRef: 0,
stencilFunc: NotEqualStencilFunc,
stencilFail: ReplaceStencilOp,
stencilZFail: ReplaceStencilOp,
stencilZPass: ReplaceStencilOp,
uniforms: uniforms.caps,
vertexShader: shader.vertex,
fragmentShader: shader.fragment
});
let frontStencilMaterial = new ShaderMaterial({
depthWrite: false,
depthTest: false,
colorWrite: false,
stencilWrite: true,
stencilFunc: AlwaysStencilFunc,
uniforms: uniforms.clipping,
vertexShader: shader.vertexClipping,
fragmentShader: shader.fragmentClippingFront,
side: FrontSide,
stencilFail: DecrementWrapStencilOp,
stencilZFail: DecrementWrapStencilOp,
stencilZPass: DecrementWrapStencilOp
});
let backStencilMaterial = new ShaderMaterial({
depthWrite: false,
depthTest: false,
colorWrite: false,
stencilWrite: true,
stencilFunc: AlwaysStencilFunc,
uniforms: uniforms.clipping,
vertexShader: shader.vertexClipping,
fragmentShader: shader.fragmentClippingFront,
side: BackSide,
stencilFail: IncrementWrapStencilOp,
stencilZFail: IncrementWrapStencilOp,
stencilZPass: IncrementWrapStencilOp
});
// beige:
// let BoxBackFace = new MeshBasicMaterial({ color: 0xEEDDCC, transparent: true });
let BoxBackFace = new MeshBasicMaterial({ color: 0xf8f8ff, transparent: true, opacity: 0.5 });
// black box grid: mouse grey:
// let BoxWireframe = new LineBasicMaterial({ color: 0x000000, linewidth: 2 });
let BoxWireframe = new LineBasicMaterial({ color: 0x6f6f6f, linewidth: 3 });
// yellow select color
let BoxWireActive = new LineBasicMaterial({ color: 0xffff00, linewidth: 4, side: DoubleSide });
let Invisible = new ShaderMaterial({
vertexShader: shader.invisibleVertexShader,
fragmentShader: shader.invisibleFragmentShader,
side: DoubleSide
});
export {
profileMaterial,
frontStencilMaterial,
backStencilMaterial,
BoxBackFace,
BoxWireframe,
BoxWireActive,
Invisible
}

151
src/js/clip/material.ts Normal file
View File

@ -0,0 +1,151 @@
import { MeshBasicMaterial } from 'three/src/materials/MeshBasicMaterial';
import { MeshStandardMaterial } from 'three/src/materials/MeshStandardMaterial';
import { LineBasicMaterial } from 'three/src/materials/LineBasicMaterial';
import { ShaderMaterial } from 'three/src/materials/ShaderMaterial';
import { uniforms } from "./uniforms";
import { shader } from './shader';
import { DoubleSide, BackSide, FrontSide, EqualStencilFunc, KeepStencilOp, DecrementStencilOp, IncrementStencilOp, InvertStencilOp, GreaterStencilFunc, NeverStencilFunc, LessStencilFunc, LessEqualStencilFunc } from 'three/src/constants';
import { DecrementWrapStencilOp, IncrementWrapStencilOp } from 'three/src/constants';
import { NotEqualStencilFunc, ReplaceStencilOp, AlwaysStencilFunc } from 'three/src/constants';
// let profileMaterial = new ShaderMaterial({
// // metalness: 0.1,
// // roughness: 0.75,
// // flatShading: true,
// stencilWrite: true,
// // stencilRef: 0,
// stencilFunc: NotEqualStencilFunc,
// stencilFail: ReplaceStencilOp,
// stencilZFail: ReplaceStencilOp,
// stencilZPass: ReplaceStencilOp,
// uniforms: uniforms.caps,
// vertexShader: shader.vertex,
// fragmentShader: shader.fragment
// });
let profileMaterial = new MeshStandardMaterial( {
color: 0xE91E63,
metalness: 0.1,
roughness: 0.75,
flatShading: true,
stencilWrite: true,
stencilRef: 0,
stencilFunc: NotEqualStencilFunc,
stencilFail: ReplaceStencilOp,
stencilZFail: ReplaceStencilOp,
stencilZPass: ReplaceStencilOp
// stencilFunc: NotEqualStencilFunc,
// stencilFail: ReplaceStencilOp,
// stencilZFail: ReplaceStencilOp,
// stencilZPass: ReplaceStencilOp
} );
let stencilMaterial = new ShaderMaterial({
depthWrite: false,
depthTest: false,
colorWrite: false,
stencilWrite: true,
stencilFunc: AlwaysStencilFunc,
// uniforms: uniforms.clipping,
vertexShader: shader.vertexClipping,
fragmentShader: shader.fragmentClippingFront,
});
let frontStencilMaterial = new ShaderMaterial({
depthWrite: false,
depthTest: false,
colorWrite: false,
stencilWrite: true,
stencilFunc: AlwaysStencilFunc,
uniforms: uniforms.clipping,
vertexShader: shader.vertexClipping,
fragmentShader: shader.fragmentClippingFront,
side: FrontSide,
// stencilFail: DecrementWrapStencilOp,
// stencilZFail: DecrementWrapStencilOp,
// stencilZPass: DecrementWrapStencilOp
stencilFail: DecrementWrapStencilOp,
stencilZFail: DecrementWrapStencilOp,
stencilZPass: DecrementWrapStencilOp
});
let backStencilMaterial = new ShaderMaterial({
depthWrite: false,
depthTest: false,
colorWrite: false,
stencilWrite: true,
stencilFunc: AlwaysStencilFunc,
uniforms: uniforms.clipping,
vertexShader: shader.vertexClipping,
fragmentShader: shader.fragmentClippingFront,
side: BackSide,
// stencilFail: IncrementWrapStencilOp,
// stencilZFail: IncrementWrapStencilOp,
// stencilZPass: IncrementWrapStencilOp
stencilFail: IncrementWrapStencilOp,
stencilZFail: IncrementWrapStencilOp,
stencilZPass: IncrementWrapStencilOp
});
// beige:
// let BoxBackFace = new MeshBasicMaterial({ color: 0xEEDDCC, transparent: true });
let BoxBackFace = new MeshBasicMaterial({ color: 0xf8f8ff, transparent: true, opacity: 0.5 });
// black box grid: mouse grey:
// let BoxWireframe = new LineBasicMaterial({ color: 0x000000, linewidth: 2 });
let BoxWireframe = new LineBasicMaterial({ color: 0x6f6f6f, linewidth: 3 });
// yellow select color
let BoxWireActive = new LineBasicMaterial({ color: 0xffff00, linewidth: 4, side: DoubleSide });
let Invisible = new ShaderMaterial({
vertexShader: shader.invisibleVertexShader,
fragmentShader: shader.invisibleFragmentShader,
side: DoubleSide
});
// export const profileMat = new MeshStandardMaterial( {
// color: 0xE91E63,
// metalness: 0.1,
// roughness: 0.75,
// flatShading: true,
// stencilWrite: true,
// // stencilRef: 0,
// stencilFunc: NotEqualStencilFunc,
// stencilFail: ReplaceStencilOp,
// stencilZFail: ReplaceStencilOp,
// stencilZPass: ReplaceStencilOp
// } );
function toBack(mat) {
const material = mat.clone();
material.side = BackSide,
material.stencilFail = IncrementWrapStencilOp;
material.stencilZFail = IncrementWrapStencilOp;
material.stencilZPass = IncrementWrapStencilOp;
return material;
};
function toFront(mat) {
const material = mat.clone();
material.side = FrontSide;
material.stencilFail = DecrementWrapStencilOp;
material.stencilZFail = DecrementWrapStencilOp;
material.stencilZPass = DecrementWrapStencilOp;
return material;
};
export {
toBack,
toFront,
stencilMaterial,
profileMaterial,
frontStencilMaterial,
backStencilMaterial,
BoxBackFace,
BoxWireframe,
BoxWireActive,
Invisible
}

11
src/js/layer/TinLayer.ts
View File

@ -30,7 +30,6 @@ import { PointsMaterial } from 'three/src/materials/PointsMaterial';
import { Points } from 'three/src/objects/Points';
import { Line } from 'three/src/objects/Line';
import hull from 'hull.js/src/hull';
import concaveman from 'concaveman/index';
import { Color } from 'three/src/math/Color';
@ -164,7 +163,8 @@ class TinLayer extends Layer {
color: { type: "c", value: new Color(color) }
}
let profileMaterial = material.profileMaterial.clone();
profileMaterial.uniforms = caps;
profileMaterial.color = new Color(color);
// profileMaterial.uniforms = caps;
this.borderMesh = new Mesh(box, profileMaterial);
// this.borderMesh.name = 'stencilFeatureBack_' + this.index;
this.borderMesh.name = 'profilePlane_' + this.name;
@ -502,6 +502,7 @@ class TinLayer extends Layer {
setVisible(visible) {
this.visible = visible;
this.objectGroup.visible = visible;
this.mainMesh.visible = visible;
this.emit('visibility-change', visible);
}
@ -821,9 +822,9 @@ class TinLayer extends Layer {
mesh.castShadow = true;
mesh.receiveShadow = true;
this._addObject(mesh, true);
if (app_scene) {
app_scene.add(this.objectGroup);
}
// if (app_scene) {
// app_scene.add(this.objectGroup);
// }
}
private _addObject(object, queryable) {

88
src/js/main.js
View File

@ -126,10 +126,10 @@ class Application {
/* Scene: that will hold all our elements such as objects, cameras and lights. */
this.scene = new Scene();
this.capsScene = new Scene();
this.backStencil = new Scene();
this.frontStencil = new Scene();
this.capsSceneArray = new Array();
// this.capsScene = new Scene();
// this.backStencil = new Scene();
// this.frontStencil = new Scene();
// this.capsSceneArray = new Array();
this._buildDefaultLights(this.scene);
//app.scene.autoUpdate = false;
//// show axes in the screen
@ -185,59 +185,79 @@ class Application {
map.on('ready', () => {
this.selectionBox.setUniforms();
// this.capsScene.add(this.selectionBox.boxMesh);
// this.scene.add(this.selection.displayMeshes);
// this.scene.add(this.selection.touchMeshes);
this.map.addLayer(this.selectionBox);
let modelNode = new Group();
let profileNode = new Group();
for (const [key, layer] of Object.entries(this.map.layers)) {
let stencilNode = new Group();
for (const [i, layer] of Object.entries(this.map.layers)) {
// let layer = map.layers[i];
if (layer instanceof TinLayer && layer.name != "Topography") {
if (layer instanceof TinLayer && layer.name != "Topography") {
modelNode.add(layer.mainMesh);
// this.capsScene.add(layer.borderMesh);
profileNode.add(layer.borderMesh);
// const stencilMaterial = material.stencilMaterial.clone();
let stencilFeatureBack = new Mesh(layer.geometry, material.backStencilMaterial.clone());
stencilFeatureBack.name = 'stencilFeatureBack_' + i;
stencilFeatureBack.userData.layerId = layer.index;
stencilNode.add(stencilFeatureBack);
let stencilFeatureFront = new Mesh(layer.geometry, material.frontStencilMaterial.clone());
stencilFeatureFront.name = 'stencilFeatureFront_' + i;
stencilFeatureFront.userData.layerId = layer.index;
stencilNode.add(stencilFeatureFront);
layer.on('visibility-change', (args) => {
let visible = args[0];
stencilFeatureFront.visible = visible;
stencilFeatureBack.visible = visible;
layer.borderMesh.visible = visible;
});
layer.on('scale-change', (args) => {
let z = args[0];
stencilFeatureFront.scale.z = z;
stencilFeatureBack.scale.z = z;
layer.borderMesh.scale.z = z;
});
}
}
// this.scene.add(profileNode);
let stencilNode = new Group();
for (var i in map.layers) {
let layer = map.layers[i];
if (layer instanceof TinLayer && layer.name != "Topography") {
let stencilFeatureBack = new Mesh(layer.geometry, material.backStencilMaterial);
stencilFeatureBack.name = 'stencilFeatureBack_' + i;
stencilFeatureBack.userData.layerId = layer.index;
stencilNode.add(stencilFeatureBack);
let stencilFeatureFront = new Mesh(layer.geometry, material.frontStencilMaterial);
stencilFeatureFront.name = 'stencilFeatureFront_' + i;
stencilFeatureFront.userData.layerId = layer.index;
stencilNode.add(stencilFeatureFront);
layer.on('visibility-change', (args) => {
let visible = args[0];
stencilFeatureFront.visible = visible;
stencilFeatureBack.visible = visible;
});
layer.on('scale-change', (args) => {
let z = args[0];
stencilFeatureFront.scale.z = z;
stencilFeatureBack.scale.z = z;
});
}
}
// for (var i in map.layers) {
// let layer = map.layers[i];
// if (layer instanceof TinLayer && layer.name != "Topography") {
// let stencilFeatureBack = new Mesh(layer.geometry, material.backStencilMaterial);
// stencilFeatureBack.name = 'stencilFeatureBack_' + i;
// stencilFeatureBack.userData.layerId = layer.index;
// stencilNode.add(stencilFeatureBack);
// let stencilFeatureFront = new Mesh(layer.geometry, material.frontStencilMaterial);
// stencilFeatureFront.name = 'stencilFeatureFront_' + i;
// stencilFeatureFront.userData.layerId = layer.index;
// stencilNode.add(stencilFeatureFront);
// layer.on('visibility-change', (args) => {
// let visible = args[0];
// stencilFeatureFront.visible = visible;
// stencilFeatureBack.visible = visible;
// });
// layer.on('scale-change', (args) => {
// let z = args[0];
// stencilFeatureFront.scale.z = z;
// stencilFeatureBack.scale.z = z;
// });
// }
// }
// scene.add(node('selectNode'));
// scene.add(node('modelNode'));
this.scene.add(modelNode);
this.scene.add(stencilNode);
this.scene.add(profileNode);
@ -387,7 +407,7 @@ class Application {
// // break;
// // }
// // }
// gl.stencilFunc(gl.ALWAYS, 1, 0xff);
// gl.stencilOp(gl.KEEP, gl.KEEP, gl.INCR);
// this.renderer.render(this.backStencil, this.map.camera);