|
|
@@ -0,0 +1,255 @@
|
|
|
+import * as THREE from 'three'
|
|
|
+
|
|
|
+export const limitForHeight = {
|
|
|
+ view: null,
|
|
|
+ limitH: null,
|
|
|
+ maxLimitH:null,
|
|
|
+ analyseLayerView: null,
|
|
|
+ analyseLayer: null,
|
|
|
+ externalRenderers:null,
|
|
|
+ drawVertices: [],
|
|
|
+ setup(context) {
|
|
|
+ this.renderer = new THREE.WebGLRenderer({
|
|
|
+ context: context.gl,
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ alpha: true
|
|
|
+ })
|
|
|
+ this.renderer.shadowMap.enabled = true
|
|
|
+ this.renderer.shadowMap.type = THREE.PCFSoftShadowMap
|
|
|
+
|
|
|
+ this.renderer.setPixelRatio(window.devicePixelRatio)
|
|
|
+
|
|
|
+ this.renderer.setViewport(0, 0, this.view.width, this.view.height)
|
|
|
+
|
|
|
+ this.renderer.autoClearDepth = false
|
|
|
+ this.renderer.autoClearStencil = false
|
|
|
+ this.renderer.autoClearColor = false
|
|
|
+
|
|
|
+
|
|
|
+ var originalSetRenderTarget = this.renderer.setRenderTarget.bind(this.renderer)
|
|
|
+ this.renderer.setRenderTarget = function (target) {
|
|
|
+ originalSetRenderTarget(target)
|
|
|
+ this.state.viewport(new THREE.Vector4(0, 0, this.view.width, this.view.height))
|
|
|
+ if (target == null) {
|
|
|
+ context.bindRenderTarget()
|
|
|
+ }
|
|
|
+ }.bind(this.renderer)
|
|
|
+
|
|
|
+
|
|
|
+ this.renderer.localClippingEnabled = true
|
|
|
+
|
|
|
+ this.scene = new THREE.Scene()
|
|
|
+ this.camera = new THREE.PerspectiveCamera()
|
|
|
+ this.camera.far = 10000000
|
|
|
+ this.ambient = new THREE.AmbientLight(0xffffff, 1)
|
|
|
+ this.scene.add(this.ambient)
|
|
|
+ this.sun = new THREE.DirectionalLight(0xffffff, 0.5)
|
|
|
+ this.scene.add(this.sun)
|
|
|
+
|
|
|
+ this.start(context)
|
|
|
+ context.resetWebGLState()
|
|
|
+ },
|
|
|
+ render(context) {
|
|
|
+ var cam = context.camera
|
|
|
+ this.camera.position.set(cam.eye[0], cam.eye[1], cam.eye[2])
|
|
|
+ this.camera.up.set(cam.up[0], cam.up[1], cam.up[2])
|
|
|
+ this.camera.lookAt(new THREE.Vector3(cam.center[0], cam.center[1], cam.center[2]))
|
|
|
+
|
|
|
+ this.camera.projectionMatrix.fromArray(cam.projectionMatrix)
|
|
|
+
|
|
|
+
|
|
|
+ let that = this
|
|
|
+ if (
|
|
|
+ this.meshGroup &&
|
|
|
+ this.meshGroup.children.length > 0 &&
|
|
|
+ this.meshGroup.children[0].material.uniforms
|
|
|
+ ) {
|
|
|
+ this.meshGroup.children.forEach(function (mesh) {
|
|
|
+ mesh.material.uniforms.limit.value = that.limitH
|
|
|
+ mesh.material.uniforms.maxLimit.value = that.maxLimitH
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ this.renderer.state.reset()
|
|
|
+
|
|
|
+ context.bindRenderTarget()
|
|
|
+ this.renderer.render(this.scene, this.camera)
|
|
|
+ this.externalRenderers.requestRender(this.view)
|
|
|
+ context.resetWebGLState()
|
|
|
+ },
|
|
|
+ async start(context) {
|
|
|
+ if (this.analyseLayerView) {
|
|
|
+ let clipPanels = this.createClipPlane()
|
|
|
+ let meshMaterial = this.analysisRender()
|
|
|
+ meshMaterial.clippingPlanes = clipPanels
|
|
|
+ this.meshGroup = new THREE.Group()
|
|
|
+ debugger
|
|
|
+ let posGroup = await this.analyseLayerView.getFeatureInfo()
|
|
|
+ this.createGeometry(posGroup)
|
|
|
+ this.meshGroup &&
|
|
|
+ this.meshGroup.children.forEach(function (mesh) {
|
|
|
+ mesh.material = meshMaterial
|
|
|
+ })
|
|
|
+ this.scene.add(this.meshGroup)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ createGeometry(posGroup) {
|
|
|
+ posGroup.forEach((object_pos) => {
|
|
|
+ var geometry = new THREE.BufferGeometry()
|
|
|
+ geometry.setAttribute('position', new THREE.BufferAttribute(new Float32Array(object_pos), 3))
|
|
|
+ geometry.computeBoundingBox()
|
|
|
+ geometry.computeBoundingSphere()
|
|
|
+ geometry.computeVertexNormals()
|
|
|
+
|
|
|
+ const positions = geometry.attributes.position
|
|
|
+ const normals = geometry.attributes.normal
|
|
|
+ let uvs = []
|
|
|
+
|
|
|
+ for (let i = 0; i < positions.count; i++) {
|
|
|
+ const normal = new THREE.Vector3(
|
|
|
+ normals.getX(i),
|
|
|
+ normals.getY(i),
|
|
|
+ normals.getZ(i)
|
|
|
+ ).normalize()
|
|
|
+
|
|
|
+ const position = new THREE.Vector3(positions.getX(i), positions.getY(i), positions.getZ(i))
|
|
|
+ uvs.push((normal.x + 1) / 2, (normal.y + 1) / 2)
|
|
|
+ }
|
|
|
+ geometry.setAttribute('uv', new THREE.BufferAttribute(Float32Array.from(uvs), 2, false))
|
|
|
+ var material = new THREE.MeshPhongMaterial({
|
|
|
+ color: 'red',
|
|
|
+ transparent: false,
|
|
|
+
|
|
|
+ polygonOffset: true,
|
|
|
+ polygonOffsetFactor: -0.5,
|
|
|
+ polygonOffsetUnits: -0.5
|
|
|
+ })
|
|
|
+ var mesh = new THREE.Mesh(geometry, material)
|
|
|
+ mesh.updateMatrix()
|
|
|
+ this.meshGroup.add(mesh)
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
+ createClipPlane() {
|
|
|
+ let clipPanels = []
|
|
|
+ debugger
|
|
|
+ this.drawVertices.push(this.drawVertices[0])
|
|
|
+ for (let k = 0; k < this.drawVertices.length - 1; k++) {
|
|
|
+ let point1 = this.drawVertices[k]
|
|
|
+ let point2 = this.drawVertices[k + 1]
|
|
|
+ let base1 = []
|
|
|
+ let base2 = []
|
|
|
+ let top1 = []
|
|
|
+ this.externalRenderers.toRenderCoordinates(
|
|
|
+ this.view,
|
|
|
+ [point1[0], point1[1], 0],
|
|
|
+ 0,
|
|
|
+ this.view.spatialReference,
|
|
|
+ base1,
|
|
|
+ 0,
|
|
|
+ 1
|
|
|
+ )
|
|
|
+ this.externalRenderers.toRenderCoordinates(
|
|
|
+ this.view,
|
|
|
+ [point2[0], point2[1], 0],
|
|
|
+ 0,
|
|
|
+ this.view.spatialReference,
|
|
|
+ base2,
|
|
|
+ 0,
|
|
|
+ 1
|
|
|
+ )
|
|
|
+ this.externalRenderers.toRenderCoordinates(
|
|
|
+ this.view,
|
|
|
+ [point1[0], point1[1], point1[2] + 1000],
|
|
|
+ 0,
|
|
|
+ this.view.spatialReference,
|
|
|
+ top1,
|
|
|
+ 0,
|
|
|
+ 1
|
|
|
+ )
|
|
|
+ let plane = new THREE.Plane()
|
|
|
+ let p1_1 = new THREE.Vector3(base1[0], base1[1], base1[2])
|
|
|
+ let p2_1 = new THREE.Vector3(top1[0], top1[1], top1[2])
|
|
|
+ let p3_1 = new THREE.Vector3(base2[0], base2[1], base2[2])
|
|
|
+ plane.setFromCoplanarPoints(p1_1, p2_1, p3_1)
|
|
|
+ clipPanels.push(plane)
|
|
|
+ }
|
|
|
+ return clipPanels
|
|
|
+ },
|
|
|
+ analysisRender() {
|
|
|
+
|
|
|
+ let material = new THREE.MeshBasicMaterial({
|
|
|
+
|
|
|
+ color: '#FF0000',
|
|
|
+ opacity: 0.8,
|
|
|
+ transparent: true,
|
|
|
+ side: THREE.DoubleSide,
|
|
|
+ depthTest: false
|
|
|
+ })
|
|
|
+ material.onBeforeCompile = function (shader, renderer) {
|
|
|
+ debugger
|
|
|
+
|
|
|
+ const getFoot = `
|
|
|
+ uniform mat4 cameraMatrix;
|
|
|
+ uniform mat4 projectionMatrixInverse;
|
|
|
+ varying float depth;
|
|
|
+ varying vec2 depthUv;
|
|
|
+
|
|
|
+ varying vec4 vPosition;
|
|
|
+ #include <common>
|
|
|
+ `
|
|
|
+ const begin_vertex = `
|
|
|
+ #include <worldpos_vertex>
|
|
|
+ vPosition= modelMatrix * vec4(transformed, 1.0 );
|
|
|
+ `
|
|
|
+ const height_vary = `
|
|
|
+ uniform float opacity;
|
|
|
+ uniform float limit;
|
|
|
+ uniform float maxLimit;
|
|
|
+ uniform float baseHeight;
|
|
|
+ varying vec4 vPosition;
|
|
|
+ float getHeight(vec3 point){
|
|
|
+ float distR = length(point);
|
|
|
+ float height=distR-6378137.0;
|
|
|
+ return height-0.1;
|
|
|
+ }
|
|
|
+ `
|
|
|
+ const height_frag = `
|
|
|
+ vec3 outgoingLight = reflectedLight.indirectDiffuse;
|
|
|
+ float ph=getHeight(vPosition.xyz);
|
|
|
+ if(ph>=limit&&ph<=maxLimit){
|
|
|
+
|
|
|
+ }else{
|
|
|
+ diffuseColor.a=0.0;
|
|
|
+ }
|
|
|
+ `
|
|
|
+ shader.vertexShader = shader.vertexShader.replace('#include <common>', getFoot)
|
|
|
+ shader.vertexShader = shader.vertexShader.replace('#include <worldpos_vertex>', begin_vertex)
|
|
|
+ shader.fragmentShader = shader.fragmentShader.replace('uniform float opacity;', height_vary)
|
|
|
+
|
|
|
+ shader.fragmentShader = shader.fragmentShader.replace(
|
|
|
+ 'vec3 outgoingLight = reflectedLight.indirectDiffuse;',
|
|
|
+ height_frag
|
|
|
+ )
|
|
|
+
|
|
|
+ shader.uniforms.limit = {
|
|
|
+ value: this.limitH
|
|
|
+ }
|
|
|
+ shader.uniforms.maxLimit = {
|
|
|
+ value: this.maxLimitH
|
|
|
+ }
|
|
|
+ shader.uniforms.baseHeight = {
|
|
|
+ value: 0.0
|
|
|
+ }
|
|
|
+ material.uniforms = shader.uniforms
|
|
|
+ }
|
|
|
+ material.needsUpdate = true
|
|
|
+ return material
|
|
|
+ }
|
|
|
+}
|
