cesium-od-vue3
Version:
cesium、od、飞线
2 lines (1 loc) • 3.65 kB
JavaScript
"use strict";const l=require("vue"),k=require("cesium"),O=require("../share/od.js"),g=require("lodash-es"),y=require("../share/component.js");function M(n){const u=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const e in n)if(e!=="default"){const o=Object.getOwnPropertyDescriptor(n,e);Object.defineProperty(u,e,o.get?o:{enumerable:!0,get:()=>n[e]})}}return u.default=n,Object.freeze(u)}const i=M(k),j=l.defineComponent({__name:"OdLine",props:{show:{type:Boolean,default:!0},origin:{},destination:{},color:{default:"#00FAA4"},width:{default:5},pointAlpha:{default:.5},interpolation:{default:100},sagitta:{default:.5},midT:{default:.5},odName:{default:"odLine"},tail:{default:()=>({...y.tailDefaultOptions})},odLineOptions:{default:()=>({})},odFlyLineOptions:{default:()=>({})},startPointOptions:{default:()=>({})},endPointOptions:{default:()=>({})},focus:{type:Boolean,default:!0},animate:{type:Boolean,default:!0},startEllipseSize:{default:18e3},startEllipseScaleStep:{default:.02}},setup(n,{expose:u}){const e=n,o=l.inject(y.cesiumViewerInjectKey);if(!(o!=null&&o.value))throw TypeError("viewer inject error!");const t=o.value,r=g.merge({},y.tailDefaultOptions,e.tail),_=i.Cartesian3.fromDegrees(e.origin.longitude,e.origin.latitude),b=i.Cartesian3.fromDegrees(e.destination.longitude,e.destination.latitude),d=O.createCurvedLine(e.origin,e.destination,e.interpolation,e.sagitta,e.midT);let f,c,s=l.ref(0),p=l.ref(0);const w=new i.ColorMaterialProperty(i.Color.fromCssColorString(e.color).withAlpha(e.pointAlpha));f=t.entities.add(O.useCreateOdLineOptions({name:e.odName,positions:d,width:e.width,color:e.color},e.odLineOptions)),c=t.entities.add(O.useCreateOdFlyLineOptions({name:e.odName+"_flyline",positions:e.animate?new i.CallbackProperty(()=>d.slice(Math.max(0,s.value-r.width),Math.max(0,s.value-r.width+r.width)),!1):i.Cartesian3.fromDegreesArray([]),width:r.width,color:r.color,glowPower:r.glowPower,taperPower:r.taperPower,position:d[0]},e.odFlyLineOptions));function C(){return e.animate?new i.CallbackProperty(()=>e.startEllipseSize*p.value,!1):e.startEllipseSize}const S=g.merge({position:_,ellipse:{semiMajorAxis:C(),semiMinorAxis:C(),height:0,fill:!0,extrudedHeight:0,material:w,outline:!0,outlineColor:i.Color.WHITE,outlineWidth:1},label:{text:"Origin",font:"14pt sans-serif",style:i.LabelStyle.FILL_AND_OUTLINE,outlineWidth:2,verticalOrigin:i.VerticalOrigin.BOTTOM,pixelOffset:new i.Cartesian2(0,-10)}},e.startPointOptions),m=t.entities.add(S),D=g.merge({position:b,ellipse:{semiMajorAxis:10,semiMinorAxis:10,height:0,fill:!0,extrudedHeight:0,material:w,outline:!0,outlineColor:i.Color.WHITE,outlineWidth:1},label:{text:"Destination",font:"14pt sans-serif",style:i.LabelStyle.FILL_AND_OUTLINE,outlineWidth:2,verticalOrigin:i.VerticalOrigin.BOTTOM,pixelOffset:new i.Cartesian2(0,-10)}},e.endPointOptions),h=t.entities.add(D);function L(){s.value++,s.value>=d.length&&(s.value=0),p.value+=e.startEllipseScaleStep,p.value>=1&&(p.value=0),P(d[s.value])}function P(a){try{c.position=a}catch(A){window.console.error(A)}}function E(){t.clock.onTick.addEventListener(L)}function v(){t.clock.onTick.addEventListener(L)}function T(){t.flyTo([m,h])}e.focus&&T(),e.animate&&E();function x(){!t||t!=null&&t.isDestroyed()||(v(),t.entities.remove(f),t.entities.remove(c),t.entities.remove(m),t.entities.remove(h))}return l.watch(()=>e.show,a=>{f.show=a,c.show=a,m.show=a,h.show=a}),l.onUnmounted(()=>{x()}),u({progress:s,scale:p,odLineEntity:f,flyOdLineEntity:c,startPointEntity:m,endPointEntity:h,updateFlyLinePos:P,focusEntities:T,destoryEntity:x,bindTickAnimate:E,unBindTickAnimate:v}),(a,A)=>null}});module.exports=j;