@ohuoy/easymap 1.1.0 → 1.1.3

package/index.js

@@ -125,9 +125,52 @@ export class EasyMap {
     }
 
 
-    setStyle(url){
-      this.map.setStyle(url)
-      this.map.theme.value = this.map.style.stylesheet.theme
+    setMapStyle(style){
+      let map = this.map;
+      const layerIds = map.style.order 
+      const oldLayer = map.getStyle().layers;
+      let sources =[]
+      let layers = []
+      layerIds.forEach(id => {
+        let layer = map.getLayer(id);
+        if(layer.source){
+          let source = map.getSource(layer.source)
+          sources.push(source)
+        }                
+        layers.push(layer)
+        map.removeLayer(id)
+      });
+      const handleStyleLoad = () => {
+        // Object.keys(sources).forEach(key => {
+        //   if (!map.getSource(key)) {
+        //     map.addSource(key, sources[key]);
+        //   }
+        // }
+      // );
+       
+        sources.forEach(source=>{
+          if (!map.getSource(source.id)) {
+            map.addSource(source.id,source._options);
+          }
+        })
+        layers.forEach(layer=>{
+          if (!map.getLayer(layer.id)) {
+            map.addLayer(layer);
+          }
+        })
+        map.theme.value = map.style.stylesheet.theme
+      
+        map.off('style.load', handleStyleLoad);
+      };
+      
+      map.on('style.load', handleStyleLoad);
+      map.setStyle(style);
+    }
+
+    async setStyle(url){
+      if(this.map){ 
+        this.setMapStyle(url)               
+      }
     }
     addScale(postion="bottom-right"){
       if(this.ScaleControl){

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohuoy/easymap",
-  "version": "1.1.0",
+  "version": "1.1.3",
   "description": "self map easy use",
   "main": "main.js",
   "scripts": {

package/src/components/layer/AnimationLayer.js

@@ -16,6 +16,7 @@ export default class AnimationLayer{
     timerId
     speed=1//帧
     itemList = []
+    oldItem ={}
     opacity = 0.8
     obj = {}
     status = actionStatus.Pause
@@ -82,6 +83,7 @@ export default class AnimationLayer{
       if(this.itemList.length == 0){
         return;
       }
+      this.oldItem =Object.assign({},item);
       this.obj = this.loadMesh()
     }
 
@@ -226,8 +228,11 @@ export default class AnimationLayer{
         map,
         gl, //get the context from Mapbox
         { defaultLights: true ,passiveRendering:false}
-      );  
+      );        
       this.createInterval()   
+      if(this.oldItem.imageList){
+        this.createTexture(this.oldItem)
+      }
       esMapWatchEffect(()=>{
         this.updateStyleByTheme()
       })      

package/src/components/layer/ThreeScanLayer.js

@@ -11,6 +11,7 @@ export default class ThreeScanLayer{
     opacity = 0.8
     textClass = ''
     forceClear = false
+    oldDrawArray = []
     constructor(id,config) {
         this.id = id;
         this.opacity = Number(config.opacity)
@@ -21,7 +22,7 @@ export default class ThreeScanLayer{
     }
 
     //同时渲染多个地点图片文本
-    async drawImageList(list,delay = 300){                 
+    async drawImageList(list,delay = 300){              
         for(let i in list){
             await this.update(list[i])
             //this.drawArray.push(list[i])
@@ -34,6 +35,7 @@ export default class ThreeScanLayer{
             }
         }  
         this.drawArray = this.drawArray.filter(a=>a) 
+        this.oldDrawArray = Object.assign([],this.drawArray)     
         // this.tb.update(); 
         // this.map.triggerRepaint();
         await sleep(delay)
@@ -289,16 +291,26 @@ export default class ThreeScanLayer{
         point.mesh = mesh;
     }
 
-    onAdd(map, gl) {
-        this.map = map;   
+    resetDraw(){
+        if(this.oldDrawArray.length > 0){
+            for(let i in this.oldDrawArray){
+                this.update(this.oldDrawArray[i])
+            }  
+        }
+    }
+
+    onAdd(map, gl) {        
+        this.map = map;  
         this.tb = new Threebox(
           map,
           gl, //get the context from Mapbox
           { defaultLights: true ,passiveRendering:false}
         );   
+        this.resetDraw()
         esMapWatchEffect(()=>{
             this.updateStyleByTheme()
         })       
+        
     }
     render(gl, matrix) {    
         this.tb.update();