feat scene add destroy method

demos/01_point_circle.html

@@ -91,6 +91,9 @@ scene.on('loaded', () => {
     })
     .render();
     
+    setTimeout(()=>{
+      scene.destroy();
+    },2000)
   
  });
 });

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/l7",
-  "version": "1.3.4",
+  "version": "1.3.5-beta.1",
   "description": "Large-scale WebGL-powered Geospatial Data Visualization",
   "main": "build/L7.js",
   "homepage": "https://github.com/antvis/l7",

src/component/control/attribution.js

@@ -10,7 +10,6 @@ export default class Attribution extends Control {
     this._attributions = {};
   }
   onAdd(scene) {
-    scene.attributionControl = this;
     this._container = DOM.create('div', 'l7-control-attribution');
     const layers = scene.getLayers();
     for (const i in layers) {

src/core/engine/composer.js

@@ -5,6 +5,7 @@ import * as THREE from '../three';
 import CopyShader from './copy-shader';
 import ShaderPass from './shader-pass';
 import MaskPass, {ClearMaskPass} from './mask-pass';
+import { destoryObject } from '../../util/object3d-util';
 
 /**
  * @author alteredq / http://alteredqualia.com/
@@ -142,6 +143,10 @@ EffectComposer.prototype = {
 		this.renderTarget1.setSize( width, height );
 		this.renderTarget2.setSize( width, height );
 
+	},
+	destory: function () {
+		this.renderTarget1.dispose();
+		this.renderTarget2.dispose();
 	}
 
 };

src/core/engine/index.js

@@ -4,6 +4,7 @@ import Scene from './scene';
 import Camera from './camera';
 import Renderer from './renderer';
 import Picking from './picking/picking';
+import { destoryObject } from '../../util/object3d-util';
 export default class Engine extends EventEmitter {
   constructor(container, world) {
     super();
@@ -29,6 +30,18 @@ export default class Engine extends EventEmitter {
     this._initPostProcessing();
   }
   destroy() {
+    destoryObject(this._scene);
+    this.composerLayers.forEach(layer => {
+      layer.distory();
+    });
+    destoryObject(this.composerLayers);
+
+    this._picking.destroy();
+    this._picking = null;
+    this._world = null;
+    this.clock = null;
+    this._camera = null;
+    this._renderer = null;
   }
   // 渲染第三方Scene对象
   renderScene(scene) {

src/core/engine/picking/picking.js

@@ -1,5 +1,6 @@
 import PickingScene from './pickingScene';
 import * as THREE from '../../three';
+import { destoryObject } from '../../../util/object3d-util';
 let nextId = 1;
 
 class Picking {
@@ -136,32 +137,7 @@ class Picking {
     // TODO: Find a way to properly remove these listeners as they stay
     // active at the moment
     window.removeEventListener('resize', this._resizeHandler, false);
-    this._envents.forEach(event => {
-      this._world._container.removeEventListener(event[0], event[1], false);
-    });
-
-    if (this._pickingScene.children) {
-      // Remove everything else in the layer
-      let child;
-      for (let i = this._pickingScene.children.length - 1; i >= 0; i--) {
-        child = this._pickingScene.children[i];
-
-        if (!child) {
-          continue;
-        }
-
-        this._pickingScene.remove(child);
-        if (child.material) {
-          if (child.material.map) {
-            child.material.map.dispose();
-            child.material.map = null;
-          }
-
-          child.material.dispose();
-          child.material = null;
-        }
-      }
-    }
+    destoryObject(this._pickingScene);
 
     this._pickingScene = null;
     this._pickingTexture = null;

src/core/scene.js

@@ -11,6 +11,7 @@ import Style from './style';
 import Controller from './controller/control';
 import * as Control from '../component/control';
 import { epsg3857 } from '@antv/geo-coord/lib/geo/crs/crs-epsg3857';
+const EventNames = [ 'mouseout', 'mouseover', 'mousemove', 'mousedown', 'mouseleave', 'mouseleave', 'mouseleave', 'touchstart', 'touchmove', 'touchend', 'mouseup', 'rightclick', 'click', 'dblclick' ];
 export default class Scene extends Base {
   getDefaultCfg() {
     return Global.scene;
@@ -22,7 +23,6 @@ export default class Scene extends Base {
     this.fontAtlasManager = new FontAtlasManager();
     this._layers = [];
     this.animateCount = 0;
-    this.inited = false;
   }
 
   _initEngine(mapContainer) {
@@ -142,26 +142,17 @@ export default class Scene extends Base {
 
   }
   _registEvents() {
-    const events = [
-      'mouseout',
-      'mouseover',
-      'mousemove',
-      'mousedown',
-      'mouseleave',
-      'touchstart',
-      'touchmove',
-      'touchend',
-      'mouseup',
-      'rightclick',
-      'click',
-      'dblclick'
-    ];
-    events.forEach(event => {
-      this._container.addEventListener(event, e => {
-        // 要素拾取
-        if (e.target.nodeName !== 'CANVAS') return;
-        this._engine._picking.pickdata(e);
-      }, true);
+    this._eventHander = e => {
+      if (e.target.nodeName !== 'CANVAS') return;
+      this._engine._picking.pickdata(e);
+    };
+    EventNames.forEach(event => {
+      this._container.addEventListener(event, this._eventHander, true);
+    });
+  }
+  _unRegistEvents() {
+    EventNames.forEach(event => {
+      this._container.removeEventListener(event, this._eventHander, true);
     });
   }
 
@@ -194,12 +185,14 @@ export default class Scene extends Base {
     // this.map.on('mousemove', this._updateRender);
     this.map.on('mapmove', this._updateRender);
     this.map.on('camerachange', this._updateRender);
+    window.addEventListener('onresize', this._updateRender);
   }
 
   unRegsterMapEvent() {
     // this.map.off('mousemove', this._updateRender);
     this.map.off('mapmove', this._updateRender);
     this.map.off('camerachange', this._updateRender);
+    window.removeEventListener('onresize', this._updateRender);
   }
   // control
 
@@ -211,4 +204,22 @@ export default class Scene extends Base {
   removeControl(ctr) {
     this.get('controlController').removeControl(ctr);
   }
+  destroy() {
+    super.destroy();
+    this._layers.forEach(layer => {
+      layer.destroy();
+    });
+    this._layers.length = 0;
+    this.image = null;
+    this.fontAtlasManager = null;
+    this.style.destroy();
+    this.style = null;
+    this._engine.destroy();
+    this._engine = null;
+    this.map.destroy();
+    this.unRegsterMapEvent();
+    this._unRegistEvents();
+
+
+  }
 }

src/core/style.js

@@ -87,6 +87,10 @@ export default class Style extends Base {
     this.scene.map.off('zoomchange', this.mapEventHander);
     this.scene.map.off('dragend', this.mapEventHander);
   }
+  destroy() {
+    this.WorkerController.remove();
+
+  }
   // 计算视野内的瓦片坐标
 
 }

src/map/AMap.js

@@ -35,21 +35,21 @@ export default class GaodeMap extends Base {
 
   initMap() {
     const mapStyle = this.get('mapStyle');
-    // if (mapStyle) {
-    //   switch (mapStyle) {
-    //     case 'dark':
-    //       this.set('mapStyle', Theme.DarkTheme.mapStyle);
-    //       break;
-    //     case 'light':
-    //       this.set('mapStyle', Theme.LightTheme.mapStyle);
-    //       break;
-    //     case 'blank':
-    //       this.set('mapStyle', 'blank');
-    //       break;
-    //     default:
-    //       this.set('mapStyle', mapStyle);
-    //   }
-    // }
+    if (mapStyle) {
+      switch (mapStyle) {
+        case 'dark':
+          this.set('mapStyle', Theme.DarkTheme.mapStyle);
+          break;
+        case 'light':
+          this.set('mapStyle', Theme.LightTheme.mapStyle);
+          break;
+        case 'blank':
+          this.set('mapStyle', 'blank');
+          break;
+        default:
+          this.set('mapStyle', mapStyle);
+      }
+    }
     this.set('zooms', [ this.get('minZoom'), this.get('maxZoom') ]);
     const map = this.get('map');
     if (map instanceof AMap.Map) {

src/worker/actor.js

@@ -72,4 +72,7 @@ export default class Actor {
     }
 
   }
+  remove() {
+    this.target.removeEventListener('message', this.receive, false);
+  }
 }