diff --git a/src/view/park/center.vue b/src/view/park/center.vue index cab4d2a..a434717 100644 --- a/src/view/park/center.vue +++ b/src/view/park/center.vue @@ -180,7 +180,7 @@ } } svg{ - opacity: 0; + // opacity: 0; } } @keyframes move { @@ -239,7 +239,7 @@ - + @@ -284,14 +284,14 @@ import { Thumbs } from 'swiper'; var items={select:null,list:[]} var center=[101.863986 -0.02,25.776215 -0.01] var region=reactive([ - {name:"羊街乡",lan:101.9611474,lng:26.0824059}, - {name:"老城乡",lan:101.9111474,lng:25.9554059}, - {name:"元谋镇",lan:101.8921474,lng:25.8484059}, - {name:"平甸乡",lan:101.7527297,lng:25.8148077}, - {name:"新华乡",lan:101.6810768,lng:25.7208770}, + {name:"羊街镇",lan:101.9301474,lng:26.0574059}, + {name:"老城乡",lan:101.8811474,lng:25.9254059}, + {name:"元谋镇",lan:101.8701474,lng:25.8154059}, + {name:"平甸乡",lan:101.7647297,lng:25.7918077}, + {name:"新华乡",lan:101.6910768,lng:25.7798770}, {name:"物茂乡",lan:101.7810768,lng:25.6308770}, - {name:"凉山乡",lan:101.978559,lng:25.83327}, - {name:"黄瓜园镇",lan:101.8753983,lng:25.7285168}, + {name:"凉山乡",lan:101.972559,lng:25.81227}, + {name:"黄瓜园镇",lan:101.8653983,lng:25.7235168}, {name:"江边乡",lan:101.9035691,lng:25.581815}, {name:"姜驿乡",lan:101.9960739,lng:25.500477}, ]) @@ -379,6 +379,9 @@ import { Thumbs } from 'swiper'; labels.push(mesh) mesh.renderOrder=6 mesh.position.set(115*(-center[0]+v.lan),1.5,115*(-center[1]+v.lng)) + watch(offset,n=>{ + mesh.position.set(115*(-center[0]+v.lan +n.x/1000),1.5,115*(-center[1]+v.lng +n.y/1000)) + }) mesh.rotation.x=-Math.PI/6 time_line.to(material,{opacity:1, duration:1,onStart(){ @@ -429,10 +432,10 @@ import { Thumbs } from 'swiper'; bgMesh.rotation.x=-Math.PI/2 bgMesh.renderOrder=1 - time_line.to(bgMaterial,{opacity:1,duration:2,onStart(){ + time_line.to(bgMaterial,{opacity:1,duration:1,onStart(){ scene.add(bgMesh) }}) - time_line.to(bgMesh.position,{y:0.1,duration:1},"-=2") + time_line.to(bgMesh.position,{y:0.1,duration:1},"-=1") } async function addBG2(){ var bgGeometry=new THREE.PlaneGeometry(316/9.1,599/9.1) @@ -447,10 +450,10 @@ import { Thumbs } from 'swiper'; bgMesh.rotation.x=-Math.PI/2 bgMesh.renderOrder=2 - time_line.to(bgMaterial,{opacity:1,duration:2,onStart(){ + time_line.to(bgMaterial,{opacity:1,duration:1,onStart(){ scene.add(bgMesh) }}) - time_line.to(bgMesh.position,{y:0.2,duration:1},"-=2") + time_line.to(bgMesh.position,{y:0.2,duration:1},"-=1") //标记 await setLine( @@ -462,7 +465,7 @@ import { Thumbs } from 'swiper'; ] ) await setLine( - [101.750373,0.21,25.725215], + [101.750373,0.21,25.735215], {text:"现代冬早蔬菜联农带农业产业示范区",color:"#10CC40",order:2}, [ -0.02, 2, 0, @@ -491,10 +494,10 @@ import { Thumbs } from 'swiper'; bgMesh.position.set(115*(-center[0]+101.886473),10,115*(-center[1]+25.770215)) bgMesh.rotation.x=-Math.PI/2 - time_line.to(bgMaterial,{opacity:1,duration:2,onStart(){ + time_line.to(bgMaterial,{opacity:1,duration:1,onStart(){ scene.add(bgMesh) }}) - time_line.to(bgMesh.position,{y:0.3,duration:1},"-=2") + time_line.to(bgMesh.position,{y:0.3,duration:1},"-=1") await setLine( [101.820373,0.31,25.695215], @@ -518,13 +521,13 @@ import { Thumbs } from 'swiper'; bgMesh.position.set(115*(-center[0]+101.806473),10,115*(-center[1]+25.770215)) bgMesh.rotation.x=-Math.PI/2 - time_line.to(bgMaterial,{opacity:1,duration:2,onStart(){ + time_line.to(bgMaterial,{opacity:1,duration:1,onStart(){ scene.add(bgMesh) }}) - time_line.to(bgMesh.position,{y:0.4,duration:1},"-=2") + time_line.to(bgMesh.position,{y:0.4,duration:1},"-=1") await setLine( - [101.891373,0.41,25.644215], + [101.891373,0.41,25.654215], {text:"右廊-要素聚集特色产业发展廊道",color:"#F19149",order:4}, [ 0.02, 5, 0, @@ -576,9 +579,6 @@ import { Thumbs } from 'swiper'; }) var pointMesh=new THREE.Mesh(point,pointMaterial) pointMesh.position.set(115*(-center[0]+label[0]),label[1],115*(-center[1]+label[2])) - watch(offset,n=>{ - pointMesh.position.set(115*(-center[0]+label[0] +n.x/1000),label[1],115*(-center[1]+label[2] +n.y/1000)) - }) pointMesh.rotation.x=-Math.PI/2 pointMesh.renderOrder=order+0.1