@supermapgis/vue-iclient-leaflet 11.2.0

package/lib/web-map/index.js

@@ -0,0 +1,2241 @@
+module.exports =
+/******/ (function(modules) { // webpackBootstrap
+/******/ 	// The module cache
+/******/ 	var installedModules = {};
+/******/
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/
+/******/ 		// Check if module is in cache
+/******/ 		if(installedModules[moduleId]) {
+/******/ 			return installedModules[moduleId].exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = installedModules[moduleId] = {
+/******/ 			i: moduleId,
+/******/ 			l: false,
+/******/ 			exports: {}
+/******/ 		};
+/******/
+/******/ 		// Execute the module function
+/******/ 		modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
+/******/
+/******/ 		// Flag the module as loaded
+/******/ 		module.l = true;
+/******/
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/
+/******/
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = modules;
+/******/
+/******/ 	// expose the module cache
+/******/ 	__webpack_require__.c = installedModules;
+/******/
+/******/ 	// define getter function for harmony exports
+/******/ 	__webpack_require__.d = function(exports, name, getter) {
+/******/ 		if(!__webpack_require__.o(exports, name)) {
+/******/ 			Object.defineProperty(exports, name, { enumerable: true, get: getter });
+/******/ 		}
+/******/ 	};
+/******/
+/******/ 	// define __esModule on exports
+/******/ 	__webpack_require__.r = function(exports) {
+/******/ 		if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
+/******/ 			Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+/******/ 		}
+/******/ 		Object.defineProperty(exports, '__esModule', { value: true });
+/******/ 	};
+/******/
+/******/ 	// create a fake namespace object
+/******/ 	// mode & 1: value is a module id, require it
+/******/ 	// mode & 2: merge all properties of value into the ns
+/******/ 	// mode & 4: return value when already ns object
+/******/ 	// mode & 8|1: behave like require
+/******/ 	__webpack_require__.t = function(value, mode) {
+/******/ 		if(mode & 1) value = __webpack_require__(value);
+/******/ 		if(mode & 8) return value;
+/******/ 		if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
+/******/ 		var ns = Object.create(null);
+/******/ 		__webpack_require__.r(ns);
+/******/ 		Object.defineProperty(ns, 'default', { enumerable: true, value: value });
+/******/ 		if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
+/******/ 		return ns;
+/******/ 	};
+/******/
+/******/ 	// getDefaultExport function for compatibility with non-harmony modules
+/******/ 	__webpack_require__.n = function(module) {
+/******/ 		var getter = module && module.__esModule ?
+/******/ 			function getDefault() { return module['default']; } :
+/******/ 			function getModuleExports() { return module; };
+/******/ 		__webpack_require__.d(getter, 'a', getter);
+/******/ 		return getter;
+/******/ 	};
+/******/
+/******/ 	// Object.prototype.hasOwnProperty.call
+/******/ 	__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
+/******/
+/******/ 	// __webpack_public_path__
+/******/ 	__webpack_require__.p = "lib/leaflet/";
+/******/
+/******/
+/******/ 	// Load entry module and return exports
+/******/ 	return __webpack_require__(__webpack_require__.s = 501);
+/******/ })
+/************************************************************************/
+/******/ ({
+
+/***/ 0:
+/***/ (function(module, exports) {
+
+module.exports = require("@babel/runtime/helpers/interopRequireDefault");
+
+/***/ }),
+
+/***/ 1:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return normalizeComponent; });
+/* globals __VUE_SSR_CONTEXT__ */
+
+// IMPORTANT: Do NOT use ES2015 features in this file (except for modules).
+// This module is a runtime utility for cleaner component module output and will
+// be included in the final webpack user bundle.
+
+function normalizeComponent(
+  scriptExports,
+  render,
+  staticRenderFns,
+  functionalTemplate,
+  injectStyles,
+  scopeId,
+  moduleIdentifier /* server only */,
+  shadowMode /* vue-cli only */
+) {
+  // Vue.extend constructor export interop
+  var options =
+    typeof scriptExports === 'function' ? scriptExports.options : scriptExports
+
+  // render functions
+  if (render) {
+    options.render = render
+    options.staticRenderFns = staticRenderFns
+    options._compiled = true
+  }
+
+  // functional template
+  if (functionalTemplate) {
+    options.functional = true
+  }
+
+  // scopedId
+  if (scopeId) {
+    options._scopeId = 'data-v-' + scopeId
+  }
+
+  var hook
+  if (moduleIdentifier) {
+    // server build
+    hook = function (context) {
+      // 2.3 injection
+      context =
+        context || // cached call
+        (this.$vnode && this.$vnode.ssrContext) || // stateful
+        (this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext) // functional
+      // 2.2 with runInNewContext: true
+      if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') {
+        context = __VUE_SSR_CONTEXT__
+      }
+      // inject component styles
+      if (injectStyles) {
+        injectStyles.call(this, context)
+      }
+      // register component module identifier for async chunk inferrence
+      if (context && context._registeredComponents) {
+        context._registeredComponents.add(moduleIdentifier)
+      }
+    }
+    // used by ssr in case component is cached and beforeCreate
+    // never gets called
+    options._ssrRegister = hook
+  } else if (injectStyles) {
+    hook = shadowMode
+      ? function () {
+          injectStyles.call(
+            this,
+            (options.functional ? this.parent : this).$root.$options.shadowRoot
+          )
+        }
+      : injectStyles
+  }
+
+  if (hook) {
+    if (options.functional) {
+      // for template-only hot-reload because in that case the render fn doesn't
+      // go through the normalizer
+      options._injectStyles = hook
+      // register for functional component in vue file
+      var originalRender = options.render
+      options.render = function renderWithStyleInjection(h, context) {
+        hook.call(context)
+        return originalRender(h, context)
+      }
+    } else {
+      // inject component registration as beforeCreate hook
+      var existing = options.beforeCreate
+      options.beforeCreate = existing ? [].concat(existing, hook) : [hook]
+    }
+  }
+
+  return {
+    exports: scriptExports,
+    options: options
+  }
+}
+
+
+/***/ }),
+
+/***/ 11:
+/***/ (function(module, exports) {
+
+module.exports = require("vue-property-decorator");
+
+/***/ }),
+
+/***/ 12:
+/***/ (function(module, exports) {
+
+module.exports = require("@babel/runtime/helpers/extends");
+
+/***/ }),
+
+/***/ 14:
+/***/ (function(module, exports) {
+
+module.exports = require("@babel/runtime/helpers/createClass");
+
+/***/ }),
+
+/***/ 15:
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+var _interopRequireDefault = __webpack_require__(0);
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _Message = _interopRequireDefault(__webpack_require__(16));
+
+var _default = exports.default = _Message.default;
+
+/***/ }),
+
+/***/ 16:
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+var _interopRequireDefault = __webpack_require__(0);
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _extends2 = _interopRequireDefault(__webpack_require__(12));
+
+var _message = _interopRequireDefault(__webpack_require__(17));
+
+var defaultPrefixCls = 'sm-component-message';
+var configCallback = _message.default.config;
+configCallback({
+  prefixCls: defaultPrefixCls
+});
+
+_message.default.config = function (options) {
+  if (options.prefixCls && options.prefixCls !== defaultPrefixCls) {
+    _message.default.destroy();
+  }
+
+  configCallback((0, _extends2.default)({}, options, {
+    prefixCls: options.prefixCls || defaultPrefixCls
+  }));
+};
+
+var _default = exports.default = _message.default;
+
+/***/ }),
+
+/***/ 17:
+/***/ (function(module, exports) {
+
+module.exports = require("ant-design-vue/es/message");
+
+/***/ }),
+
+/***/ 19:
+/***/ (function(module, exports) {
+
+module.exports = require("leaflet");
+
+/***/ }),
+
+/***/ 22:
+/***/ (function(module, exports) {
+
+module.exports = require("resize-detector");
+
+/***/ }),
+
+/***/ 23:
+/***/ (function(module, exports) {
+
+module.exports = require("lodash.debounce");
+
+/***/ }),
+
+/***/ 233:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony import */ var _node_modules_babel_loader_lib_index_js_node_modules_ts_loader_index_js_ref_0_1_node_modules_vue_loader_lib_index_js_vue_loader_options_WebMap_vue_vue_type_script_lang_ts___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(234);
+/* harmony import */ var _node_modules_babel_loader_lib_index_js_node_modules_ts_loader_index_js_ref_0_1_node_modules_vue_loader_lib_index_js_vue_loader_options_WebMap_vue_vue_type_script_lang_ts___WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_babel_loader_lib_index_js_node_modules_ts_loader_index_js_ref_0_1_node_modules_vue_loader_lib_index_js_vue_loader_options_WebMap_vue_vue_type_script_lang_ts___WEBPACK_IMPORTED_MODULE_0__);
+/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _node_modules_babel_loader_lib_index_js_node_modules_ts_loader_index_js_ref_0_1_node_modules_vue_loader_lib_index_js_vue_loader_options_WebMap_vue_vue_type_script_lang_ts___WEBPACK_IMPORTED_MODULE_0__) if(["default"].indexOf(__WEBPACK_IMPORT_KEY__) < 0) (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _node_modules_babel_loader_lib_index_js_node_modules_ts_loader_index_js_ref_0_1_node_modules_vue_loader_lib_index_js_vue_loader_options_WebMap_vue_vue_type_script_lang_ts___WEBPACK_IMPORTED_MODULE_0__[key]; }) }(__WEBPACK_IMPORT_KEY__));
+ /* harmony default export */ __webpack_exports__["default"] = (_node_modules_babel_loader_lib_index_js_node_modules_ts_loader_index_js_ref_0_1_node_modules_vue_loader_lib_index_js_vue_loader_options_WebMap_vue_vue_type_script_lang_ts___WEBPACK_IMPORTED_MODULE_0___default.a); 
+
+/***/ }),
+
+/***/ 234:
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+var _interopRequireDefault = __webpack_require__(0);
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _createClass2 = _interopRequireDefault(__webpack_require__(14));
+
+var _inheritsLoose2 = _interopRequireDefault(__webpack_require__(6));
+
+var _WebMapViewModel = _interopRequireDefault(__webpack_require__(503));
+
+var _VmUpdater = _interopRequireDefault(__webpack_require__(247));
+
+var _mapEvent = _interopRequireDefault(__webpack_require__(249));
+
+var _vuePropertyDecorator = __webpack_require__(11);
+
+var _resizeDetector = __webpack_require__(22);
+
+var _lodash = _interopRequireDefault(__webpack_require__(23));
+
+var _mapEvents = _interopRequireDefault(__webpack_require__(505));
+
+var _Spin = _interopRequireDefault(__webpack_require__(506));
+
+var _index = _interopRequireDefault(__webpack_require__(15));
+
+var __decorate = void 0 && (void 0).__decorate || function (decorators, target, key, desc) {
+  var c = arguments.length,
+      r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
+      d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+
+var SmWebMap = /*#__PURE__*/function (_Mixins) {
+  (0, _inheritsLoose2.default)(SmWebMap, _Mixins);
+
+  function SmWebMap() {
+    var _this;
+
+    _this = _Mixins.apply(this, arguments) || this;
+    _this.spinning = true;
+    _this.ready = false;
+    return _this;
+  }
+
+  var _proto = SmWebMap.prototype;
+
+  _proto.mapIdChanged = function mapIdChanged() {
+    this.spinning = true;
+  };
+
+  _proto.mounted = function mounted() {
+    this.initializeWebMap();
+    this.registerEvents();
+  };
+
+  _proto.beforeDestroy = function beforeDestroy() {
+    this.destory();
+
+    _mapEvent.default.$options.deleteMap(this.target);
+
+    _mapEvent.default.$options.deleteWebMap(this.target);
+  };
+
+  _proto.load = function load(value) {
+    return value;
+  };
+
+  _proto.getMapFailed = function getMapFailed(value) {
+    return value;
+  };
+
+  _proto.getLayerDatasourceFailed = function getLayerDatasourceFailed(value) {
+    return value;
+  };
+
+  _proto.initializeWebMap = function initializeWebMap() {
+    var _this2 = this;
+
+    var _this$$props = this.$props,
+        target = _this$$props.target,
+        serverUrl = _this$$props.serverUrl,
+        accessToken = _this$$props.accessToken,
+        accessKey = _this$$props.accessKey,
+        tiandituKey = _this$$props.tiandituKey,
+        withCredentials = _this$$props.withCredentials,
+        excludePortalProxyUrl = _this$$props.excludePortalProxyUrl,
+        isSuperMapOnline = _this$$props.isSuperMapOnline,
+        mapOptions = _this$$props.mapOptions;
+    this.viewModel = new _WebMapViewModel.default(this.mapId, {
+      target: target,
+      serverUrl: serverUrl,
+      accessToken: accessToken,
+      accessKey: accessKey,
+      tiandituKey: tiandituKey,
+      withCredentials: withCredentials,
+      excludePortalProxyUrl: excludePortalProxyUrl,
+      isSuperMapOnline: isSuperMapOnline
+    }, mapOptions);
+
+    if (this.autoresize) {
+      this.__resizeHandler = (0, _lodash.default)(function () {
+        _this2.resize();
+      }, 100, {
+        leading: true
+      });
+      (0, _resizeDetector.addListener)(this.$el, this.__resizeHandler);
+    }
+  };
+
+  _proto.resize = function resize() {
+    var _this3 = this;
+
+    if (this.viewModel && this.viewModel.resize) {
+      this.$nextTick(function () {
+        _this3.viewModel.resize();
+      });
+    }
+  };
+
+  _proto.registerEvents = function registerEvents() {
+    var _this4 = this;
+
+    this.viewModel.on({
+      addlayerssucceeded: function addlayerssucceeded(e) {
+        _this4.spinning = false;
+
+        _mapEvent.default.$options.setMap(_this4.target, e.map);
+
+        _this4.viewModel && _mapEvent.default.$options.setWebMap(_this4.target, _this4.viewModel);
+
+        _mapEvent.default.$emit('load-map', e.map, _this4.target);
+
+        _this4.map = e.map;
+        _this4.mapObject = e.map;
+        _this4.ready = true;
+
+        _this4.$nextTick(function () {
+          _this4.viewModel.resize();
+        });
+
+        _this4.bindMapEvents();
+
+        _this4.load({
+          map: e.map
+        });
+      },
+      getmapinfofailed: function getmapinfofailed(e) {
+        _this4.getMapFailed({
+          error: e.error
+        });
+
+        _index.default.error(e.error.message);
+
+        _this4.spinning = false;
+      },
+      getlayerdatasourcefailed: function getlayerdatasourcefailed(e) {
+        _this4.getLayerDatasourceFailed({
+          error: e.error,
+          layer: e.layer,
+          map: e.map
+        });
+
+        if (e.error === 'SAMPLE DATA is not supported') {
+          _index.default.error(_this4.$t('webmap.sampleDataNotSupport'));
+        } else {
+          _index.default.error(_this4.$t('webmap.getLayerInfoFailed'));
+        }
+      },
+      notsupportmvt: function notsupportmvt() {
+        _index.default.error('暂不支持加载矢量瓦片图层！');
+
+        _this4.spinning = false;
+      }
+    });
+  };
+
+  _proto.destory = function destory() {
+    if (this.autoresize) {
+      (0, _resizeDetector.removeListener)(this.$el, this.__resizeHandler);
+    }
+  };
+
+  (0, _createClass2.default)(SmWebMap, [{
+    key: "getMapTarget",
+    get: function get() {
+      return this.target;
+    }
+  }]);
+  return SmWebMap;
+}((0, _vuePropertyDecorator.Mixins)(_VmUpdater.default, _mapEvents.default));
+
+__decorate([(0, _vuePropertyDecorator.Provide)()], SmWebMap.prototype, "__resizeHandler", void 0);
+
+__decorate([(0, _vuePropertyDecorator.Provide)()], SmWebMap.prototype, "ready", void 0);
+
+__decorate([(0, _vuePropertyDecorator.Prop)()], SmWebMap.prototype, "mapId", void 0);
+
+__decorate([(0, _vuePropertyDecorator.Prop)({
+  default: 'map'
+})], SmWebMap.prototype, "target", void 0);
+
+__decorate([(0, _vuePropertyDecorator.Prop)({
+  default: 'https://www.supermapol.com'
+})], SmWebMap.prototype, "serverUrl", void 0);
+
+__decorate([(0, _vuePropertyDecorator.Prop)()], SmWebMap.prototype, "accessToken", void 0);
+
+__decorate([(0, _vuePropertyDecorator.Prop)()], SmWebMap.prototype, "accessKey", void 0);
+
+__decorate([(0, _vuePropertyDecorator.Prop)()], SmWebMap.prototype, "tiandituKey", void 0);
+
+__decorate([(0, _vuePropertyDecorator.Prop)({
+  default: false
+})], SmWebMap.prototype, "withCredentials", void 0);
+
+__decorate([(0, _vuePropertyDecorator.Prop)()], SmWebMap.prototype, "excludePortalProxyUrl", void 0);
+
+__decorate([(0, _vuePropertyDecorator.Prop)()], SmWebMap.prototype, "isSuperMapOnline", void 0);
+
+__decorate([(0, _vuePropertyDecorator.Prop)()], SmWebMap.prototype, "mapOptions", void 0);
+
+__decorate([(0, _vuePropertyDecorator.Prop)({
+  default: true
+})], SmWebMap.prototype, "autoresize", void 0);
+
+__decorate([(0, _vuePropertyDecorator.Watch)('mapId')], SmWebMap.prototype, "mapIdChanged", null);
+
+__decorate([(0, _vuePropertyDecorator.Emit)()], SmWebMap.prototype, "load", null);
+
+__decorate([(0, _vuePropertyDecorator.Emit)()], SmWebMap.prototype, "getMapFailed", null);
+
+__decorate([(0, _vuePropertyDecorator.Emit)()], SmWebMap.prototype, "getLayerDatasourceFailed", null);
+
+SmWebMap = __decorate([(0, _vuePropertyDecorator.Component)({
+  name: 'SmWebMap',
+  components: {
+    SmSpin: _Spin.default
+  },
+  viewModelProps: ['mapId', 'serverUrl', 'mapOptions.center', 'mapOptions.zoom', 'mapOptions.minZoom', 'mapOptions.maxZoom', 'mapOptions.maxBounds', 'withCredentials']
+})], SmWebMap);
+
+var _default = exports.default = SmWebMap;
+
+/***/ }),
+
+/***/ 247:
+/***/ (function(module, exports) {
+
+module.exports = require("@supermapgis/vue-iclient-leaflet/lib/_mixin/VmUpdater.js");
+
+/***/ }),
+
+/***/ 248:
+/***/ (function(module, exports) {
+
+module.exports = require("@supermapgis/vue-iclient-leaflet/static/libs/geostats/geostats");
+
+/***/ }),
+
+/***/ 249:
+/***/ (function(module, exports) {
+
+module.exports = require("@supermapgis/vue-iclient-leaflet/lib/_types/map-event.js");
+
+/***/ }),
+
+/***/ 25:
+/***/ (function(module, exports) {
+
+module.exports = require("@turf/center");
+
+/***/ }),
+
+/***/ 277:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+
+// EXPORTS
+__webpack_require__.d(__webpack_exports__, "a", function() { return /* reexport */ render; });
+__webpack_require__.d(__webpack_exports__, "b", function() { return /* reexport */ staticRenderFns; });
+
+// CONCATENATED MODULE: ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./src/leaflet/web-map/WebMap.vue?vue&type=template&id=3484f35d&
+var render = function () {
+  var _vm = this
+  var _h = _vm.$createElement
+  var _c = _vm._self._c || _h
+  return _c(
+    "div",
+    { staticClass: "sm-component-web-map", attrs: { id: _vm.target } },
+    [
+      _vm.ready ? _vm._t("default") : _vm._e(),
+      _vm.spinning
+        ? _c("sm-spin", {
+            attrs: {
+              size: "large",
+              tip: _vm.$t("webmap.loadingTip"),
+              spinning: _vm.spinning,
+            },
+          })
+        : _vm._e(),
+    ],
+    2
+  )
+}
+var staticRenderFns = []
+render._withStripped = true
+
+
+// CONCATENATED MODULE: ./src/leaflet/web-map/WebMap.vue?vue&type=template&id=3484f35d&
+
+
+/***/ }),
+
+/***/ 3:
+/***/ (function(module, exports) {
+
+module.exports = require("@supermapgis/vue-iclient-leaflet/lib/init.js");
+
+/***/ }),
+
+/***/ 33:
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+var _interopRequireDefault = __webpack_require__(0);
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _leaflet = _interopRequireDefault(__webpack_require__(19));
+
+// @property lastId: Number
+// Last unique ID used by [`stamp()`](#util-stamp)
+var lastId = 0; // @function stamp(obj: Object): Number
+// Returns the unique ID of an object, assigning it one if it doesn't have it.
+
+function stamp(obj) {
+  /*eslint-disable */
+  obj._leaflet_id = obj._leaflet_id || ++lastId;
+  return obj._leaflet_id;
+  /* eslint-enable */
+}
+
+_leaflet.default.Map.prototype.addLayer = function (layer, name) {
+  if (!layer._layerAdd) {
+    throw new Error('The provided object is not a Layer.');
+  }
+
+  var id = stamp(layer); // 如果layer已存在，返回this
+
+  if (this._layers[id] || this._layers[name]) {
+    return this;
+  } // 如果用户没有传入name，就生成一个name
+
+
+  if (!name) {
+    name = 'sm-custom' + id;
+  } // 如果该name已存在，就生成新的name
+
+
+  if (this._layers[name]) {
+    this.fire('addLayerFailed', 'layer name重复,请输入唯一的name');
+    return this;
+  } // 将layer和name添加到layersOnMap
+
+
+  layer.name = name; // 不要将featureLayer加入layersOnMap
+  // let _layersId = {};
+  // for (let key in this._layers) {
+  //   if (this._layers[key]._layers) {
+  //     _layersId[key] = [];
+  //     for (let key2 in this._layers[key]._layers) {
+  //       _layersId[key].push(key2);
+  //     }
+  //   }
+  // }
+  // let layersOnMapFlag = true;
+  // for (let key in _layersId) {
+  //   if (_layersId[key].indexOf(id + '') > -1) {
+  //     layersOnMapFlag = false;
+  //   }
+  // }
+
+  if (!this.layersOnMap) {
+    this.layersOnMap = [];
+  }
+
+  this.layersOnMap.push({
+    name: name,
+    layer: layer
+  }); // if (layersOnMapFlag) {
+  //   this.layersOnMap.push({ name, layer });
+  // }
+
+  this._layers[id] = layer;
+  layer._mapToAdd = this;
+
+  if (layer.beforeAdd) {
+    layer.beforeAdd(this);
+  }
+
+  this.whenReady(layer._layerAdd, layer);
+  return this;
+};
+
+_leaflet.default.Map.prototype.removeLayer = function (layer, name) {
+  // 重新构造layersOnMap
+  this.layersOnMap = this.layersOnMap.filter(function (l) {
+    return l.name !== (layer.name || name);
+  }); // 如果是传入图层，就用图层id; 如果传入name,通过name去获取图层id
+
+  var id = stamp(layer) || this._layers[name].id;
+
+  if (!this._layers[id]) {
+    return this;
+  }
+
+  if (this._loaded) {
+    layer.onRemove(this);
+  }
+
+  if (layer.getAttribution && this.attributionControl) {
+    this.attributionControl.removeAttribution(layer.getAttribution());
+  }
+
+  delete this._layers[id];
+
+  if (this._loaded) {
+    this.fire('layerremove', {
+      layer: layer,
+      name: name
+    });
+    layer.fire('remove');
+  }
+
+  layer._map = layer._mapToAdd = null;
+  return this;
+};
+
+_leaflet.default.Map.include({
+  getLayersOnMap: function getLayersOnMap() {
+    return this.layersOnMap;
+  },
+  getLayerById: function getLayerById(id) {
+    return this._layers[id];
+  },
+  getLayerByName: function getLayerByName(name) {
+    for (var key in this._layers) {
+      if (name === this._layers[key].name) {
+        return this._layers[key];
+      }
+    }
+  },
+  getAllLayers: function getAllLayers() {
+    return this._layers;
+  }
+});
+
+delete _leaflet.default.Icon.Default.prototype._getIconUrl;
+
+_leaflet.default.Icon.Default.mergeOptions({
+  iconRetinaUrl: __webpack_require__(34),
+  iconUrl: __webpack_require__(35),
+  shadowUrl: __webpack_require__(36)
+});
+
+window.L = _leaflet.default;
+
+var _default = exports.default = _leaflet.default;
+
+/***/ }),
+
+/***/ 34:
+/***/ (function(module, exports) {
+
+module.exports = require("leaflet/dist/images/marker-icon-2x.png");
+
+/***/ }),
+
+/***/ 35:
+/***/ (function(module, exports) {
+
+module.exports = require("leaflet/dist/images/marker-icon.png");
+
+/***/ }),
+
+/***/ 36:
+/***/ (function(module, exports) {
+
+module.exports = require("leaflet/dist/images/marker-shadow.png");
+
+/***/ }),
+
+/***/ 37:
+/***/ (function(module, exports) {
+
+module.exports = require("@supermapgis/vue-iclient-leaflet/static/libs/iclient-leaflet/iclient-leaflet.min.js");
+
+/***/ }),
+
+/***/ 43:
+/***/ (function(module, exports) {
+
+module.exports = require("@babel/runtime/regenerator");
+
+/***/ }),
+
+/***/ 501:
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+var _interopRequireDefault = __webpack_require__(0);
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _WebMap = _interopRequireDefault(__webpack_require__(502));
+
+var _init = _interopRequireDefault(__webpack_require__(3));
+
+_WebMap.default.install = function (Vue, opts) {
+  (0, _init.default)(Vue, opts);
+  Vue.component(_WebMap.default.options ? _WebMap.default.options.name : _WebMap.default.name, _WebMap.default);
+};
+
+var _default = exports.default = _WebMap.default;
+
+/***/ }),
+
+/***/ 502:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony import */ var _WebMap_vue_vue_type_template_id_3484f35d___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(277);
+/* harmony import */ var _WebMap_vue_vue_type_script_lang_ts___WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(233);
+/* harmony reexport (unknown) */ for(var __WEBPACK_IMPORT_KEY__ in _WebMap_vue_vue_type_script_lang_ts___WEBPACK_IMPORTED_MODULE_1__) if(["default"].indexOf(__WEBPACK_IMPORT_KEY__) < 0) (function(key) { __webpack_require__.d(__webpack_exports__, key, function() { return _WebMap_vue_vue_type_script_lang_ts___WEBPACK_IMPORTED_MODULE_1__[key]; }) }(__WEBPACK_IMPORT_KEY__));
+/* harmony import */ var _node_modules_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(1);
+
+
+
+
+
+/* normalize component */
+
+var component = Object(_node_modules_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_2__[/* default */ "a"])(
+  _WebMap_vue_vue_type_script_lang_ts___WEBPACK_IMPORTED_MODULE_1__["default"],
+  _WebMap_vue_vue_type_template_id_3484f35d___WEBPACK_IMPORTED_MODULE_0__[/* render */ "a"],
+  _WebMap_vue_vue_type_template_id_3484f35d___WEBPACK_IMPORTED_MODULE_0__[/* staticRenderFns */ "b"],
+  false,
+  null,
+  null,
+  null
+  
+)
+
+/* harmony default export */ __webpack_exports__["default"] = (component.exports);
+
+/***/ }),
+
+/***/ 503:
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+var _interopRequireDefault = __webpack_require__(0);
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _regenerator = _interopRequireDefault(__webpack_require__(43));
+
+var _inheritsLoose2 = _interopRequireDefault(__webpack_require__(6));
+
+var _leafletWrapper = _interopRequireDefault(__webpack_require__(33));
+
+__webpack_require__(37);
+
+__webpack_require__(248);
+
+var _center = _interopRequireDefault(__webpack_require__(25));
+
+var _WebMapBase2 = _interopRequireDefault(__webpack_require__(504));
+
+var _epsgDefine = __webpack_require__(51);
+
+var __awaiter = void 0 && (void 0).__awaiter || function (thisArg, _arguments, P, generator) {
+  function adopt(value) {
+    return value instanceof P ? value : new P(function (resolve) {
+      resolve(value);
+    });
+  }
+
+  return new (P || (P = Promise))(function (resolve, reject) {
+    function fulfilled(value) {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    }
+
+    function rejected(value) {
+      try {
+        step(generator["throw"](value));
+      } catch (e) {
+        reject(e);
+      }
+    }
+
+    function step(result) {
+      result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected);
+    }
+
+    step((generator = generator.apply(thisArg, _arguments || [])).next());
+  });
+};
+
+var WebMapViewModel = exports.default = /*#__PURE__*/function (_WebMapBase) {
+  (0, _inheritsLoose2.default)(WebMapViewModel, _WebMapBase);
+
+  function WebMapViewModel(id, options, mapOptions) {
+    var _this;
+
+    if (options === void 0) {
+      options = {};
+    }
+
+    if (mapOptions === void 0) {
+      mapOptions = {};
+    }
+
+    _this = _WebMapBase.call(this, id, options, mapOptions) || this;
+    _this.layers = {};
+    _this._dataflowPathIdCache = {};
+    _this._dataflowLabelIdCache = {};
+    _this._dataflowLineFeatureCache = {};
+    _this.center = mapOptions.center;
+    _this.zoom = mapOptions.zoom;
+
+    _this._initWebMap();
+
+    return _this;
+  }
+
+  var _proto = WebMapViewModel.prototype;
+
+  _proto.resize = function resize() {
+    this.map && this.map.invalidateSize();
+    this.echartsLayerResize();
+  };
+
+  _proto.setCenter = function setCenter(center) {
+    if (this.map) {
+      this.mapOptions.center = center;
+      center && center.length > 0 && this.map.setView(center, this.zoom);
+    }
+  };
+
+  _proto._initWebMap = function _initWebMap() {
+    this.initWebMap();
+  };
+
+  _proto._getMapInfo = function _getMapInfo(mapInfo, _taskID) {
+    var layers = mapInfo.layers;
+    this._layers = [];
+
+    this._createMap(mapInfo);
+
+    this._initBaseLayer(mapInfo, false);
+
+    if (!layers || layers.length === 0) {
+      this._sendMapToUser(0, 0);
+    } else {
+      this._initOverlayLayers(layers, _taskID);
+    }
+  };
+
+  _proto._createMap = function _createMap(mapInfo) {
+    var _this2 = this;
+
+    if (!mapInfo) {
+      this.map = _leafletWrapper.default.map(this.target, {
+        center: this.center && this.center.length ? _leafletWrapper.default.latLng(this.center[0], this.center[1]) : [0, 0],
+        zoom: this.zoom || 0,
+        crs: this.mapOptions.crs || _leafletWrapper.default.CRS.EPSG3857,
+        maxZoom: this.mapOptions.maxZoom || 30,
+        minZoom: this.mapOptions.minZoom || 0,
+        preferCanvas: this.mapOptions.preferCanvas || true
+      });
+      setTimeout(function () {
+        _this2.triggerEvent('addlayerssucceeded', {
+          map: _this2.map,
+          mapparams: {},
+          layers: []
+        });
+      }, 0);
+      return;
+    }
+
+    var level = mapInfo.level,
+        maxZoom = mapInfo.maxZoom,
+        minZoom = mapInfo.minZoom;
+    var zoom = level || 0;
+    zoom = zoom === 0 ? 0 : zoom;
+
+    var crs = this._handleMapCrs(mapInfo);
+
+    var center = this._getMapCenter(mapInfo);
+
+    this.map = _leafletWrapper.default.map(this.target, {
+      center: this.center || center,
+      zoom: this.zoom || zoom,
+      crs: crs,
+      maxZoom: maxZoom || 30,
+      minZoom: minZoom || 0,
+      preferCanvas: true
+    });
+    this.triggerEvent('mapinitialized', {
+      map: this.map
+    });
+  };
+
+  _proto._initBaseLayer = function _initBaseLayer(mapInfo, sendToMap) {
+    if (sendToMap === void 0) {
+      sendToMap = true;
+    }
+
+    var layerInfo = mapInfo.baseLayer || mapInfo;
+    var layerType = this.getBaseLayerType(layerInfo);
+    var mapUrls = this.getMapurls({
+      CLOUD: 'http://t2.dituhui.com/FileService/image',
+      CLOUD_BLACK: 'http://t3.dituhui.com/MapService/getGdp',
+      OSM: 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'
+    });
+    var url;
+    var layer;
+
+    switch (layerType) {
+      case 'TIANDITU':
+        layer = this._createTiandituLayer(layerInfo);
+        break;
+
+      case 'BING':
+        layer = this._createBingLayer();
+        break;
+
+      case 'WMS':
+        layer = this._createWMSLayer(layerInfo);
+        break;
+
+      case 'WMTS':
+        layer = this._createWMTSLayer(layerInfo);
+        break;
+
+      case 'TILE':
+        layer = this._createDynamicTiledLayer(layerInfo);
+        break;
+
+      case 'CLOUD':
+        url = mapUrls[layerInfo.layerType];
+        layer = this._createCLOUDLayer(layerType, url);
+        break;
+
+      case 'XYZ':
+        url = mapUrls[layerInfo.layerType];
+        layer = this._createXYZLayer(url);
+        break;
+
+      case 'BAIDU':
+        layer = this._createBaiduTileLayer();
+        break;
+
+      case 'MAPBOXSTYLE':
+        this.triggerEvent('notsupportmvt', {});
+        break;
+
+      default:
+        break;
+    }
+
+    layer && this._addLayerToMap({
+      layer: layer,
+      type: 'baseLayers',
+      layerInfo: layerInfo,
+      sendToMap: sendToMap
+    });
+  };
+
+  _proto._initOverlayLayers = function _initOverlayLayers(layers, _taskID) {
+    var _this3 = this;
+
+    this._layers = layers;
+    this.layerAdded = 0;
+    this.expectLayerLen = layers.length;
+
+    if (this.expectLayerLen > 0) {
+      layers.forEach(function (layer, index) {
+        var type = _this3.webMapService.getDatasourceType(layer);
+
+        if (type === 'SAMPLE_DATA') {
+          _this3._addLayerSucceeded();
+
+          _this3.triggerEvent('getlayerdatasourcefailed', {
+            error: 'SAMPLE DATA is not supported',
+            layer: layer,
+            map: _this3.map
+          });
+
+          return;
+        }
+
+        layer.layerID = layer.name + '-' + index;
+        layer.index = index;
+
+        if (type === 'tile') {
+          _this3._initBaseLayer(layer);
+        } else {
+          _this3.getLayerFeatures(layer, _taskID, type);
+        }
+      }, this);
+    }
+  };
+
+  _proto._createMvtLayer = function _createMvtLayer() {
+    this._addLayerSucceeded();
+  };
+
+  _proto._createRestMapLayer = function _createRestMapLayer(restMaps, layer) {
+    var _this4 = this;
+
+    restMaps.forEach(function (restMapInfo, index) {
+      layer = _this4.getRestMapLayerInfo(restMapInfo, layer);
+
+      _this4._initBaseLayer(layer, index === restMaps.length - 1);
+    });
+  };
+
+  _proto._initOverlayLayer = function _initOverlayLayer(layerInfo, features) {
+    return __awaiter(this, void 0, void 0, /*#__PURE__*/_regenerator.default.mark(function _callee() {
+      var layerType, style, filterCondition, featureType, labelStyle, projection, epsgCode, layer, labelLayerInfo, labelLayer;
+      return _regenerator.default.wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            _context.prev = 0;
+            layerType = layerInfo.layerType, style = layerInfo.style, filterCondition = layerInfo.filterCondition, featureType = layerInfo.featureType, labelStyle = layerInfo.labelStyle, projection = layerInfo.projection;
+
+            if (!(layerType === 'restMap')) {
+              _context.next = 5;
+              break;
+            }
+
+            this._createRestMapLayer(features, layerInfo);
+
+            return _context.abrupt("return");
+
+          case 5:
+            if (!(layerType === 'mvt')) {
+              _context.next = 8;
+              break;
+            }
+
+            this._createMvtLayer();
+
+            return _context.abrupt("return");
+
+          case 8:
+            if (!(features && projection && projection !== 'EPSG:4326')) {
+              _context.next = 14;
+              break;
+            }
+
+            epsgCode = projection.split(':')[1];
+
+            if (epsgCode) {
+              _context.next = 12;
+              break;
+            }
+
+            return _context.abrupt("return");
+
+          case 12:
+            this._unprojectCrs = this.getTransformCoodinatesCRS(projection.split(':')[1]);
+            features = this.transformFeatures(features);
+
+          case 14:
+            features = this.handleLayerFeatures(features, layerInfo);
+            _context.t0 = layerType;
+            _context.next = _context.t0 === 'VECTOR' ? 18 : _context.t0 === 'UNIQUE' ? 34 : _context.t0 === 'RANGE' ? 38 : _context.t0 === 'HEAT' ? 42 : _context.t0 === 'MARKER' ? 46 : _context.t0 === 'RANK_SYMBOL' ? 50 : _context.t0 === 'MIGRATION' ? 54 : _context.t0 === 'DATAFLOW_POINT_TRACK' ? 58 : _context.t0 === 'DATAFLOW_HEAT' ? 58 : 62;
+            break;
+
+          case 18:
+            if (!(featureType === 'POINT')) {
+              _context.next = 30;
+              break;
+            }
+
+            if (!(style.type === 'SYMBOL_POINT')) {
+              _context.next = 25;
+              break;
+            }
+
+            _context.next = 22;
+            return this._createSymbolLayer(layerInfo, features);
+
+          case 22:
+            layer = _context.sent;
+            _context.next = 28;
+            break;
+
+          case 25:
+            _context.next = 27;
+            return this._createGraphicLayer(layerInfo, features);
+
+          case 27:
+            layer = _context.sent;
+
+          case 28:
+            _context.next = 33;
+            break;
+
+          case 30:
+            _context.next = 32;
+            return this._createVectorLayer(layerInfo, features);
+
+          case 32:
+            layer = _context.sent;
+
+          case 33:
+            return _context.abrupt("break", 62);
+
+          case 34:
+            _context.next = 36;
+            return this._createUniqueLayer(layerInfo, features);
+
+          case 36:
+            layer = _context.sent;
+            return _context.abrupt("break", 62);
+
+          case 38:
+            _context.next = 40;
+            return this._createRangeLayer(layerInfo, features);
+
+          case 40:
+            layer = _context.sent;
+            return _context.abrupt("break", 62);
+
+          case 42:
+            _context.next = 44;
+            return this._createHeatLayer(layerInfo, features);
+
+          case 44:
+            layer = _context.sent;
+            return _context.abrupt("break", 62);
+
+          case 46:
+            _context.next = 48;
+            return this._createMarkerLayer(features);
+
+          case 48:
+            layer = _context.sent;
+            return _context.abrupt("break", 62);
+
+          case 50:
+            _context.next = 52;
+            return this._createRankSymbolLayer(layerInfo, features);
+
+          case 52:
+            layer = _context.sent;
+            return _context.abrupt("break", 62);
+
+          case 54:
+            _context.next = 56;
+            return this._createMigrationLayer(layerInfo, features);
+
+          case 56:
+            layer = _context.sent;
+            return _context.abrupt("break", 62);
+
+          case 58:
+            _context.next = 60;
+            return this._createDataflowLayer(layerInfo);
+
+          case 60:
+            layer = _context.sent;
+            return _context.abrupt("break", 62);
+
+          case 62:
+            if (labelStyle && labelStyle.labelField && layerType !== 'DATAFLOW_POINT_TRACK') {
+              features = this.getFilterFeatures(filterCondition, features);
+              labelLayerInfo = JSON.parse(JSON.stringify(layerInfo));
+              labelLayer = this._addLabelLayer(labelLayerInfo, features);
+
+              this._addLayerToMap({
+                layer: _leafletWrapper.default.layerGroup([layer, labelLayer]),
+                layerInfo: layerInfo
+              });
+            } else {
+              layer && this._addLayerToMap({
+                layer: layer,
+                layerInfo: layerInfo
+              });
+            }
+
+            _context.next = 70;
+            break;
+
+          case 65:
+            _context.prev = 65;
+            _context.t1 = _context["catch"](0);
+            console.error(_context.t1);
+
+            this._addLayerSucceeded();
+
+            this.triggerEvent('getlayerdatasourcefailed', {
+              error: _context.t1,
+              layer: layerInfo,
+              map: this.map
+            });
+
+          case 70:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee, this, [[0, 65]]);
+    }));
+  };
+
+  _proto._createBingLayer = function _createBingLayer() {
+    var url = 'https://dynamic.t0.tiles.ditu.live.com/comp/ch/{quadKey}?it=G,TW,L,LA&mkt=zh-cn&og=109&cstl=w4c&ur=CN&n=z';
+    _leafletWrapper.default.TileLayer.BingLayer = _leafletWrapper.default.TileLayer.extend({
+      getTileUrl: function getTileUrl(coordinates) {
+        var z = coordinates.z,
+            x = coordinates.x,
+            y = coordinates.y;
+        var index = '';
+
+        for (var i = z; i > 0; i--) {
+          var b = 0;
+          var mask = 1 << i - 1;
+
+          if ((x & mask) !== 0) {
+            b++;
+          }
+
+          if ((y & mask) !== 0) {
+            b += 2;
+          }
+
+          index += b.toString();
+        }
+
+        return url.replace('{quadKey}', index);
+      }
+    });
+
+    _leafletWrapper.default.tileLayer.bingLayer = function (url, options) {
+      return new _leafletWrapper.default.TileLayer.BingLayer(url, options);
+    };
+
+    return _leafletWrapper.default.tileLayer.bingLayer(url, {
+      noWrap: true
+    });
+  };
+
+  _proto._createDynamicTiledLayer = function _createDynamicTiledLayer(layerInfo) {
+    var url = layerInfo.url;
+
+    var layer = _leafletWrapper.default.supermap.tiledMapLayer(url, {
+      noWrap: true,
+      prjCoordSys: {
+        epsgCode: this.baseProjection.split(':')[1]
+      }
+    });
+
+    return layer;
+  };
+
+  _proto._createWMSLayer = function _createWMSLayer(layerInfo) {
+    var url = layerInfo.url,
+        layers = layerInfo.layers;
+
+    if (!layers || layers === 'undefined' || layers === 'null') {
+      layers = '0';
+    } else if (layers.length > 0) {
+      layers = layers[0];
+    }
+
+    return _leafletWrapper.default.tileLayer.wms(url, {
+      layers: layers,
+      format: 'image/png',
+      transparent: true,
+      noWrap: true
+    });
+  };
+
+  _proto._createWMTSLayer = function _createWMTSLayer(layerInfo) {
+    var url = layerInfo.url,
+        tileMatrixSet = layerInfo.tileMatrixSet,
+        name = layerInfo.name;
+    return _leafletWrapper.default.supermap.wmtsLayer(url, {
+      layer: name,
+      style: 'default',
+      tilematrixSet: tileMatrixSet,
+      format: 'image/png',
+      noWrap: true
+    });
+  };
+
+  _proto._createTiandituLayer = function _createTiandituLayer(layerInfo) {
+    this.map.getZoom() < 1 && this.map.setZoom(1);
+    this.map.setMinZoom(1);
+    var layerType = layerInfo.layerType.split('_')[1].toLowerCase();
+    var isLabel = Boolean(layerInfo.labelLayerVisible);
+
+    var tiandituLayer = _leafletWrapper.default.supermap.tiandituTileLayer({
+      layerType: layerType,
+      key: this.tiandituKey
+    });
+
+    var tiandituLabelLayer = _leafletWrapper.default.supermap.tiandituTileLayer({
+      layerType: layerType,
+      isLabel: true,
+      key: this.tiandituKey
+    });
+
+    var layers = [tiandituLayer];
+    isLabel && layers.push(tiandituLabelLayer);
+    return _leafletWrapper.default.layerGroup(layers);
+  };
+
+  _proto._createCLOUDLayer = function _createCLOUDLayer(layerType, url) {
+    if (layerType === 'CLOUD') {
+      this.map.getZoom() < 3 && this.map.setZoom(3);
+      this.map.setMinZoom(3);
+    }
+
+    return _leafletWrapper.default.supermap.cloudTileLayer(url, {
+      noWrap: true
+    });
+  };
+
+  _proto._createXYZLayer = function _createXYZLayer(url) {
+    return _leafletWrapper.default.tileLayer(url, {
+      noWrap: true
+    });
+  };
+
+  _proto._createBaiduTileLayer = function _createBaiduTileLayer() {
+    this.map.getZoom() < 3 && this.map.setZoom(3);
+    this.map.setMinZoom(3);
+    return _leafletWrapper.default.supermap.baiduTileLayer('', {
+      noWrap: true
+    });
+  };
+
+  _proto._createUniqueLayer = function _createUniqueLayer(layerInfo, features) {
+    return this._createThemeLayer('unique', layerInfo, features);
+  };
+
+  _proto._createRangeLayer = function _createRangeLayer(layerInfo, features) {
+    return this._createThemeLayer('range', layerInfo, features);
+  };
+
+  _proto._createMarkerLayer = function _createMarkerLayer(features) {
+    var _this5 = this;
+
+    return new Promise(function (resolve) {
+      var layerGroupPromises = features && features.map(function (feature) {
+        return new Promise(function (resolve) {
+          var geomType = feature.geometry.type.toUpperCase();
+          var defaultStyle = feature.dv_v5_markerStyle;
+
+          if (geomType === 'POINT' && defaultStyle.text) {
+            geomType = 'TEXT';
+          }
+
+          var featureInfo = _this5.setFeatureInfo(feature);
+
+          feature.properties['useStyle'] = defaultStyle;
+          feature.properties['featureInfo'] = featureInfo;
+
+          if (geomType === 'POINT' && defaultStyle.src && defaultStyle.src.indexOf('http://') === -1 && defaultStyle.src.indexOf('https://') === -1) {
+            defaultStyle.src = _this5.serverUrl + defaultStyle.src;
+          }
+
+          var imgWidth = (defaultStyle.imgWidth || 48) * defaultStyle.scale;
+          var imgHeight = (defaultStyle.imgHeight || 43) * defaultStyle.scale;
+
+          if (geomType === 'POINT' && defaultStyle.src && defaultStyle.src.indexOf('svg') <= -1) {
+            resolve(_leafletWrapper.default.marker([feature.geometry.coordinates[1], feature.geometry.coordinates[0]], {
+              icon: _leafletWrapper.default.icon({
+                iconUrl: defaultStyle.src,
+                iconSize: [imgWidth, imgHeight],
+                iconAnchor: [imgWidth * defaultStyle.anchor[0], imgHeight * defaultStyle.anchor[1]]
+              })
+            }));
+          }
+
+          if (geomType === 'POINT' && defaultStyle.src && defaultStyle.src.indexOf('svg') > -1) {
+            if (!_this5._svgDiv) {
+              _this5._svgDiv = document.createElement('div');
+              document.body.appendChild(_this5._svgDiv);
+            }
+
+            _this5.getCanvasFromSVG(defaultStyle.src, _this5._svgDiv, function (canvas) {
+              resolve(_this5._getSvgLayer(canvas, defaultStyle, [feature]));
+            });
+          }
+
+          if (!defaultStyle.src) {
+            if (geomType === 'LINESTRING' && defaultStyle.lineCap || geomType === 'POLYGON') {
+              resolve(_this5._createGeojsonLayer([feature], _this5._getVectorLayerStyle(defaultStyle)));
+            } else if (geomType === 'TEXT') {
+              var text = new _leafletWrapper.default.supermap.labelThemeLayer(defaultStyle.text + '-text');
+              text.style = {
+                fontSize: defaultStyle.font.split(' ')[0],
+                labelRect: true,
+                fontColor: defaultStyle.fillColor,
+                fill: true,
+                fillColor: defaultStyle.backgroundFill,
+                stroke: false
+              };
+              text.themeField = 'text';
+              feature.properties.text = defaultStyle.text;
+              var geoTextFeature = new _leafletWrapper.default.supermap.themeFeature([feature.geometry.coordinates[1], feature.geometry.coordinates[0], defaultStyle.text], feature.properties);
+              text.addFeatures([geoTextFeature]);
+              resolve(text);
+            } else {
+              resolve(_leafletWrapper.default.circleMarker([feature.geometry.coordinates[1], feature.geometry.coordinates[0]], Object.assign({}, _this5._getVectorLayerStyle(defaultStyle))));
+            }
+          }
+        });
+      });
+      layerGroupPromises && Promise.all(layerGroupPromises).then(function (layerGroup) {
+        layerGroup && resolve(_leafletWrapper.default.layerGroup(layerGroup));
+      }).catch(function (error) {
+        console.error(error);
+      });
+    });
+  };
+
+  _proto._createRankSymbolLayer = function _createRankSymbolLayer(layerInfo, features) {
+    var _this6 = this;
+
+    var fieldName = layerInfo.themeSetting.themeField;
+    var style = layerInfo.style;
+    var styleSource = this.createRankStyleSource(layerInfo, features);
+    var styleGroups = styleSource.styleGroups;
+    features = this.getFilterFeatures(layerInfo.filterCondition, features);
+    var radiusList = [];
+    features.forEach(function (row) {
+      var target = parseFloat(row.properties[fieldName]);
+
+      if (styleGroups) {
+        for (var i = 0; i < styleGroups.length; i++) {
+          if (styleGroups[i].start <= target && target < styleGroups[i].end) {
+            var radius = style.type === 'SYMBOL_POINT' || style.type === 'IMAGE_POINT' ? style.type === 'SYMBOL_POINT' ? styleGroups[i].radius * 2 : styleGroups[i].radius : styleGroups[i].radius;
+            radiusList.push(radius);
+          }
+        }
+      }
+    }, this);
+
+    if (style.type === 'SYMBOL_POINT') {
+      return this._createSymbolLayer(layerInfo, features, radiusList);
+    } else if (style.type === 'IMAGE_POINT' || style.type === 'SVG_POINT') {
+      return this._createGraphicLayer(layerInfo, features, radiusList);
+    } else {
+      var layerGroup = [];
+      features.forEach(function (feature, index) {
+        var newStyle = Object.assign({}, style, {
+          radius: radiusList[index]
+        });
+        layerGroup.push(_leafletWrapper.default.circleMarker([feature.geometry.coordinates[1], feature.geometry.coordinates[0]], _this6._getVectorLayerStyle(newStyle)));
+      });
+      return _leafletWrapper.default.layerGroup(layerGroup);
+    }
+  };
+
+  _proto._addLabelLayer = function _addLabelLayer(layerInfo, features) {
+    var labelStyle = layerInfo.labelStyle,
+        layerID = layerInfo.layerID,
+        featureType = layerInfo.featureType;
+    var label = new _leafletWrapper.default.supermap.labelThemeLayer(layerID + '-label');
+    labelStyle.fontSize = 14;
+    labelStyle.labelRect = true;
+    labelStyle.fontColor = labelStyle.fill;
+    labelStyle.fill = true;
+    labelStyle.fillColor = '#FFFFFF';
+    labelStyle.stroke = false;
+    labelStyle.strokeColor = '#8B7B8B';
+    label.style = labelStyle;
+    label.themeField = labelStyle.labelField;
+
+    var labelFeatures = this._convertLabelFeatures(label, features, layerInfo, featureType);
+
+    label.addFeatures(labelFeatures);
+    return label;
+  };
+
+  _proto._createHeatLayer = function _createHeatLayer(layerInfo, features) {
+    var themeSetting = layerInfo.themeSetting,
+        layerID = layerInfo.layerID;
+    var colors = themeSetting.colors,
+        radius = themeSetting.radius,
+        customSettings = themeSetting.customSettings,
+        weight = themeSetting.weight;
+    var heatColors = colors.slice();
+
+    for (var i in customSettings) {
+      heatColors[i] = customSettings[i];
+    }
+
+    var heatMapLayer = _leafletWrapper.default.supermap.heatMapLayer(layerID, {
+      colors: heatColors,
+      map: this.map,
+      radius: radius * 2,
+      featureWeight: weight,
+      blur: radius * 1.5
+    });
+
+    heatMapLayer.addFeatures({
+      type: 'FeatureCollection',
+      features: features
+    });
+    return heatMapLayer;
+  };
+
+  _proto._createSymbolLayer = function _createSymbolLayer(layerInfo, features, textSize) {
+    var style = layerInfo.style;
+    var unicode = style.unicode;
+    var pointToLayer;
+
+    if (unicode) {
+      pointToLayer = this._getSymbolPointLayer(style, textSize);
+    }
+
+    return pointToLayer && this._createGeojsonLayer(features, null, pointToLayer);
+  };
+
+  _proto._createGraphicLayer = function _createGraphicLayer(layerInfo, features, textSize) {
+    var _this7 = this;
+
+    return new Promise(function (resolve) {
+      var style = layerInfo.style;
+      var type = style.type,
+          imageInfo = style.imageInfo,
+          radius = style.radius,
+          url = style.url;
+      var pointToLayer;
+
+      if (type === 'IMAGE_POINT' && imageInfo.url) {
+        var resolution = imageInfo.size.w / imageInfo.size.h;
+
+        pointToLayer = function pointToLayer(geojson, latlng) {
+          var iconSize = textSize && textSize[geojson.id - 1 || geojson.properties.index] * 2;
+          return _leafletWrapper.default.marker(latlng, {
+            icon: _leafletWrapper.default.icon({
+              iconUrl: imageInfo.url,
+              iconSize: textSize ? [iconSize, iconSize / resolution] : [radius * 2, radius * 2 / resolution]
+            })
+          });
+        };
+      } else if (type === 'SVG_POINT') {
+        if (!_this7._svgDiv) {
+          _this7._svgDiv = document.createElement('div');
+          document.body.appendChild(_this7._svgDiv);
+        }
+
+        _this7.getCanvasFromSVG(url, _this7._svgDiv, function (canvas) {
+          resolve(_this7._getSvgLayer(canvas, style, features, textSize));
+        });
+      } else {
+        pointToLayer = function pointToLayer(geojson, latlng) {
+          return _leafletWrapper.default.circleMarker(latlng, _this7._getVectorLayerStyle(style));
+        };
+      }
+
+      pointToLayer && resolve(_this7._createGeojsonLayer(features, null, pointToLayer));
+    });
+  };
+
+  _proto._createVectorLayer = function _createVectorLayer(layerInfo, features) {
+    var style = layerInfo.style;
+    return this._createGeojsonLayer(features, this._getVectorLayerStyle(style));
+  };
+
+  _proto._createMigrationLayer = function _createMigrationLayer(layerInfo, features) {
+    var options = this.getEchartsLayerOptions(layerInfo, features, 'leaflet');
+
+    var layer = _leafletWrapper.default.supermap.echartsLayer(options);
+
+    this.echartslayer.push(layer);
+    return layer;
+  };
+
+  _proto._createDataflowLayer = function _createDataflowLayer(layerInfo) {
+    var _this8 = this;
+
+    this._dataflowFeatureCache = {};
+    return new Promise(function (resolve) {
+      _this8._getDataflowPointLayer(layerInfo).then(function (pointToLayer) {
+        var dataFlowLayer = _leafletWrapper.default.supermap.dataFlowLayer(layerInfo.wsUrl, {
+          pointToLayer: pointToLayer
+        });
+
+        _this8._updateDataFlowFeaturesCallback = _this8._updateDataFlowFeature.bind(_this8, layerInfo);
+        dataFlowLayer.on('dataupdated', _this8._updateDataFlowFeaturesCallback);
+        _this8._dataFlowLayer = dataFlowLayer;
+        resolve(dataFlowLayer);
+      });
+    });
+  };
+
+  _proto._createGeojsonLayer = function _createGeojsonLayer(features, style, pointToLayer) {
+    return _leafletWrapper.default.geoJSON({
+      type: 'FeatureCollection',
+      features: features
+    }, {
+      pointToLayer: pointToLayer,
+      style: style
+    });
+  };
+
+  _proto._getVectorLayerStyle = function _getVectorLayerStyle(style) {
+    var fillColor = style.fillColor,
+        fillOpacity = style.fillOpacity,
+        strokeColor = style.strokeColor,
+        strokeOpacity = style.strokeOpacity,
+        strokeWidth = style.strokeWidth,
+        radius = style.radius,
+        lineDash = style.lineDash;
+    var commonStyle = {
+      color: strokeColor,
+      weight: strokeWidth,
+      opacity: strokeOpacity,
+      fillColor: fillColor,
+      fillOpacity: fillOpacity
+    };
+    var dashArray;
+
+    if (lineDash) {
+      dashArray = this.getDashStyle(lineDash, strokeWidth, 'string');
+    }
+
+    radius && (commonStyle['radius'] = radius);
+    lineDash && (commonStyle['dashArray'] = dashArray);
+    return commonStyle;
+  };
+
+  _proto._getMapCenter = function _getMapCenter(mapInfo) {
+    var center;
+    center = mapInfo.center && [mapInfo.center.x, mapInfo.center.y];
+
+    if (!center) {
+      center = [0, 0];
+    }
+
+    center = this.baseProjection === 'EPSG:3857' ? this.crs.unproject(_leafletWrapper.default.point(center[0], center[1])) : _leafletWrapper.default.latLng(center[1], center[0]);
+    return center;
+  };
+
+  _proto._sendMapToUser = function _sendMapToUser(count, layersLen) {
+    if (count === layersLen) {
+      this.triggerEvent('addlayerssucceeded', {
+        map: this.map,
+        mapparams: this.mapParams,
+        layers: this._layers
+      });
+    }
+  };
+
+  _proto._addLayerToMap = function _addLayerToMap(_ref) {
+    var layer = _ref.layer,
+        _ref$type = _ref.type,
+        type = _ref$type === void 0 ? 'overlays' : _ref$type,
+        layerInfo = _ref.layerInfo,
+        _ref$sendToMap = _ref.sendToMap,
+        sendToMap = _ref$sendToMap === void 0 ? true : _ref$sendToMap;
+    var visible = layerInfo.visible,
+        layerID = layerInfo.layerID,
+        name = layerInfo.name,
+        index = layerInfo.index;
+    sendToMap && (type = 'overlays');
+    type === 'overlays' && layer.setZIndex && layer.setZIndex(index + 1);
+
+    if (visible === undefined || visible) {
+      this.map.addLayer(layer, layerInfo.name);
+    }
+
+    !this.layers[type] && (this.layers[type] = {});
+    this.layers[type][layerID || name] = layer;
+
+    this._addLayerSucceeded(sendToMap);
+  };
+
+  _proto._convertLabelFeatures = function _convertLabelFeatures(layer, features, layerInfo, featureType) {
+    var _this9 = this;
+
+    if (!features) {
+      return [];
+    }
+
+    var themeField = layer.themeField,
+        style = layer.style;
+    var labelFeatures = [];
+    var layerStyle = layerInfo.style || {};
+    features.forEach(function (feature) {
+      var coordinate = _this9._getLabelLngLat(featureType, feature);
+
+      _this9._setLabelOffset(featureType, layerStyle, style);
+
+      var properties = feature.properties;
+      var geoTextFeature = new _leafletWrapper.default.supermap.themeFeature([coordinate[1], coordinate[0], properties[themeField]], properties);
+      labelFeatures.push(geoTextFeature);
+    });
+    return labelFeatures;
+  };
+
+  _proto._getLabelLngLat = function _getLabelLngLat(featureType, feature) {
+    var coordinate;
+    var coordinates = feature.geometry.coordinates;
+
+    if (featureType === 'POINT') {
+      coordinate = coordinates;
+    } else if (featureType === 'LINE') {
+      var length = coordinates.length;
+      coordinate = coordinates[Math.round(length / 2)];
+    } else {
+      coordinate = (0, _center.default)(feature).geometry.coordinates;
+    }
+
+    return coordinate;
+  };
+
+  _proto._setLabelOffset = function _setLabelOffset(featureType, layerStyle, style) {
+    if (featureType === 'POINT') {
+      var pointRadius = layerStyle.pointRadius || 0;
+      var strokeWidth = layerStyle.strokeWidth || 0;
+      var fontSize = parseInt(layerStyle.fontSize) || 0;
+      style.labelXOffset = 0;
+      style.labelYOffset = layerStyle.unicode ? 20 + fontSize : 25 + (pointRadius + strokeWidth);
+    }
+  };
+
+  _proto._addLayerSucceeded = function _addLayerSucceeded(sendMap) {
+    if (sendMap === void 0) {
+      sendMap = true;
+    }
+
+    if (sendMap) {
+      this.layerAdded++;
+
+      this._sendMapToUser(this.layerAdded, this.expectLayerLen);
+    }
+  };
+
+  _proto._unproject = function _unproject(coordinate) {
+    var crs = this._unprojectCrs || _leafletWrapper.default.CRS.EPSG3857;
+    return this._latlngToCoordinate(crs.unproject(_leafletWrapper.default.point(coordinate[0], coordinate[1])));
+  };
+
+  _proto._latlngToCoordinate = function _latlngToCoordinate(latlng) {
+    if (!latlng) {
+      return null;
+    }
+
+    return [latlng.lng, latlng.lat];
+  };
+
+  _proto._getSvgLayer = function _getSvgLayer(canvas, style, features, textSize) {
+    var svgPointToLayer = this._getSvgPointLayer(canvas, style, textSize);
+
+    return this._createGeojsonLayer(features, null, svgPointToLayer);
+  };
+
+  _proto._createThemeLayer = function _createThemeLayer(type, layerInfo, features) {
+    var filterCondition = layerInfo.filterCondition,
+        style = layerInfo.style,
+        themeSetting = layerInfo.themeSetting,
+        featureType = layerInfo.featureType,
+        layerID = layerInfo.layerID;
+    var layerStyle = JSON.parse(JSON.stringify(style));
+    featureType === 'POINT' && (layerStyle.pointRadius = style.radius);
+    delete layerStyle.radius;
+
+    if (featureType === 'LINE') {
+      layerStyle.fill = false;
+      layerStyle.strokeDashstyle = style.lineDash;
+      delete layerStyle.lineDash;
+    }
+
+    var styleGroup;
+
+    if (type === 'unique') {
+      styleGroup = this.getUniqueStyleGroup(layerInfo, features);
+    } else if (type === 'range') {
+      styleGroup = this.getRangeStyleGroup(layerInfo, features);
+    }
+
+    filterCondition && (features = this.getFilterFeatures(filterCondition, features));
+    var themeField = themeSetting.themeField;
+    Object.keys(features[0].properties).forEach(function (key) {
+      key.toLocaleUpperCase() === themeField.toLocaleUpperCase() && (themeField = key);
+    });
+
+    var layer = _leafletWrapper.default.supermap[type + "ThemeLayer"](layerID);
+
+    layerStyle.stroke = true;
+    layer.style = layerStyle;
+    layer.themeField = themeField;
+    layer.styleGroups = styleGroup;
+    layer.addFeatures({
+      type: 'FeatureCollection',
+      features: features
+    });
+    return layer;
+  };
+
+  _proto._handleMapCrs = function _handleMapCrs(mapInfo) {
+    var projection = mapInfo.projection,
+        baseLayer = mapInfo.baseLayer,
+        extent = mapInfo.extent;
+    this.baseProjection = projection;
+
+    if (projection === 'EPSG:910111' || projection === 'EPSG:910112') {
+      this.baseProjection = 'EPSG:3857';
+    } else if (projection === 'EPSG:910101' || projection === 'EPSG:910102') {
+      this.baseProjection = 'EPSG:4326';
+    }
+
+    if (baseLayer.layerType === 'BAIDU') {
+      this.crs = _leafletWrapper.default.CRS.Baidu;
+      return this.crs;
+    }
+
+    if (baseLayer.layerType.indexOf('TIANDITU') > -1) {
+      this.crs = this.baseProjection === 'EPSG:3857' ? _leafletWrapper.default.CRS.TianDiTu_Mercator : _leafletWrapper.default.CRS.TianDiTu_WGS84;
+      return this.crs;
+    }
+
+    var epsgCode = this.baseProjection.split(':')[1];
+
+    var bounds = _leafletWrapper.default.bounds([extent.leftBottom.x, extent.leftBottom.y], [extent.rightTop.x, extent.rightTop.y]);
+
+    if (['4326', '3857', '3395'].includes(epsgCode)) {
+      this.crs = _leafletWrapper.default.Proj.CRS("EPSG:" + epsgCode, {
+        bounds: bounds
+      });
+    } else if (parseFloat(epsgCode) < 0) {
+      this.crs = new _leafletWrapper.default.CRS.NonEarthCRS({
+        bounds: bounds
+      });
+    } else if (!epsgCode) {
+      this.baseProjection = (0, _epsgDefine.toEpsgCode)(this.baseProjection);
+
+      if (this.baseProjection) {
+        this.crs = _leafletWrapper.default.Proj.CRS(this.baseProjection, {
+          bounds: bounds,
+          def: mapInfo.projection
+        });
+      }
+    }
+
+    return this.crs;
+  };
+
+  _proto._updateDataFlowFeature = function _updateDataFlowFeature(layerInfo, e) {
+    if (layerInfo.visible) {
+      var feature = e.data;
+      var lineStyle = layerInfo.lineStyle,
+          labelStyle = layerInfo.labelStyle;
+      lineStyle && this._updateDataflowPathLayer(feature, layerInfo);
+      labelStyle && labelStyle.labelField !== '未设置' && this._updateDataflowLabelLayer(feature, layerInfo);
+    }
+  };
+
+  _proto._getSymbolPointLayer = function _getSymbolPointLayer(style, textSize) {
+    var symbolStyle = JSON.parse(JSON.stringify(style));
+    symbolStyle.fontColor = style.fillColor;
+    symbolStyle.label = style.unicode;
+    symbolStyle.fontFamily = 'supermapol-icons';
+
+    var pointToLayer = function pointToLayer(geojson, latlng) {
+      textSize && (symbolStyle.fontSize = textSize[geojson.id - 1 || geojson.properties.index] + 'px');
+      return new _leafletWrapper.default.supermap.unicodeMarker(latlng, symbolStyle);
+    };
+
+    return pointToLayer;
+  };
+
+  _proto._getSvgPointLayer = function _getSvgPointLayer(canvas, style, textSize) {
+    var radius = style.radius;
+    this.handleSvgColor(style, canvas);
+    var imgUrl = canvas.toDataURL('img/png');
+    var resolution = canvas.width / canvas.height;
+
+    var svgPointToLayer = function svgPointToLayer(geojson, latlng) {
+      var iconSize = textSize && textSize[geojson.id - 1 || geojson.properties.index];
+      return _leafletWrapper.default.marker(latlng, {
+        icon: _leafletWrapper.default.icon({
+          iconUrl: imgUrl,
+          iconSize: textSize ? [iconSize, iconSize / resolution] : [radius, radius / resolution]
+        })
+      });
+    };
+
+    return svgPointToLayer;
+  };
+
+  _proto._getDataflowPointLayer = function _getDataflowPointLayer(layerInfo) {
+    var _this10 = this;
+
+    var layerType = layerInfo.layerType,
+        pointStyle = layerInfo.pointStyle,
+        layerID = layerInfo.layerID,
+        themeSetting = layerInfo.themeSetting;
+    return new Promise(function (resolve) {
+      if (layerType === 'DATAFLOW_HEAT') {
+        var colors = themeSetting.colors,
+            radius = themeSetting.radius,
+            customSettings = themeSetting.customSettings,
+            weight = themeSetting.weight;
+        var heatLayerInfo = {
+          layerID: layerID,
+          themeSetting: {
+            colors: colors,
+            radius: radius,
+            customSettings: customSettings,
+            weight: weight
+          }
+        };
+
+        var pointToLayer = function pointToLayer(geojson) {
+          return _this10._createHeatLayer(heatLayerInfo, [geojson]);
+        };
+
+        resolve(pointToLayer);
+      } else if (pointStyle.type === 'SYMBOL_POINT') {
+        resolve(_this10._getSymbolPointLayer(pointStyle, null));
+      } else if (pointStyle.type === 'SVG_POINT') {
+        if (!_this10._svgDiv) {
+          _this10._svgDiv = document.createElement('div');
+          document.body.appendChild(_this10._svgDiv);
+        }
+
+        _this10.getCanvasFromSVG(pointStyle.url, _this10._svgDiv, function (canvas) {
+          resolve(_this10._getSvgPointLayer(canvas, pointStyle, null));
+        });
+      } else {
+        var _pointToLayer = function _pointToLayer(geojson, latlng) {
+          return _leafletWrapper.default.circleMarker(latlng, _this10._getVectorLayerStyle(pointStyle));
+        };
+
+        resolve(_pointToLayer);
+      }
+    });
+  };
+
+  _proto._handleDataflowFeature = function _handleDataflowFeature(feature, layerInfo) {
+    var identifyField = layerInfo.identifyField,
+        maxPointCount = layerInfo.maxPointCount,
+        lineStyle = layerInfo.lineStyle;
+    var geoID = feature.properties[identifyField];
+
+    if (lineStyle) {
+      if (this._dataflowLineFeatureCache[geoID]) {
+        var coordinates = this._dataflowLineFeatureCache[geoID].geometry.coordinates;
+        coordinates.push(feature.geometry.coordinates);
+
+        if (maxPointCount && coordinates.length > maxPointCount) {
+          coordinates.splice(0, coordinates.length - maxPointCount);
+        }
+
+        this._dataflowLineFeatureCache[geoID].geometry.coordinates = coordinates;
+      } else {
+        this._dataflowLineFeatureCache[geoID] = {
+          type: 'Feature',
+          properties: feature.properties,
+          geometry: {
+            type: 'LineString',
+            coordinates: [feature.geometry.coordinates]
+          }
+        };
+      }
+    }
+
+    this._dataflowFeatureCache[geoID] = feature;
+  };
+
+  _proto._updateDataflowLabelLayer = function _updateDataflowLabelLayer(feature, layerInfo) {
+    this._handleDataflowFeature(feature, layerInfo);
+
+    var geoID = feature.properties[layerInfo.identifyField];
+    var layer;
+
+    if (this._dataflowLabelIdCache[geoID]) {
+      layer = this._dataFlowLayer.getLayer(this._dataflowLabelIdCache[geoID]);
+      var _feature = this._dataflowFeatureCache[geoID];
+      var geoTextFeature = new _leafletWrapper.default.supermap.themeFeature([_feature.geometry.coordinates[1], _feature.geometry.coordinates[0], geoID], _feature.properties);
+      layer.removeAllFeatures();
+      layer.addFeatures([geoTextFeature]);
+    } else {
+      var _feature2 = this._dataflowFeatureCache[geoID];
+      layer = this._addLabelLayer(layerInfo, [_feature2]);
+
+      this._dataFlowLayer.addLayer(layer);
+
+      this._dataflowLabelIdCache[geoID] = this._dataFlowLayer.getLayerId(layer);
+    }
+  };
+
+  _proto._updateDataflowPathLayer = function _updateDataflowPathLayer(feature, layerInfo) {
+    this._handleDataflowFeature(feature, layerInfo);
+
+    var geoID = feature.properties[layerInfo.identifyField];
+    var layer;
+    var coordinates = this._dataflowLineFeatureCache[geoID].geometry.coordinates;
+
+    var latlngs = _leafletWrapper.default.GeoJSON.coordsToLatLngs(coordinates, 0);
+
+    if (this._dataflowPathIdCache[geoID]) {
+      layer = this._dataFlowLayer.getLayer(this._dataflowPathIdCache[geoID]);
+      layer.setLatLngs(latlngs);
+    } else {
+      layer = _leafletWrapper.default.polyline(latlngs, Object.assign({}, this._getVectorLayerStyle(layerInfo.lineStyle)));
+
+      this._dataFlowLayer.addLayer(layer);
+
+      this._dataflowPathIdCache[geoID] = this._dataFlowLayer.getLayerId(layer);
+    }
+  };
+
+  _proto.getTransformCoodinatesCRS = function getTransformCoodinatesCRS(epsgCode) {
+    var defName = "EPSG:" + epsgCode;
+    var defValue = (0, _epsgDefine.getProjection)(defName);
+    return _leafletWrapper.default.Proj.CRS((0, _epsgDefine.toEpsgCode)(defValue), {
+      def: defValue
+    });
+  };
+
+  _proto.clean = function clean() {
+    if (this.map) {
+      this.map.remove();
+      this.stopCanvg();
+      this.center = null;
+      this.zoom = null;
+
+      this._dataFlowLayer.off('dataupdated', this._updateDataFlowFeaturesCallback);
+
+      this._unprojectCrs = null;
+    }
+  };
+
+  _proto.cleanWebMap = function cleanWebMap() {
+    this.clean();
+  };
+
+  return WebMapViewModel;
+}(_WebMapBase2.default);
+
+/***/ }),
+
+/***/ 504:
+/***/ (function(module, exports) {
+
+module.exports = require("@supermapgis/vue-iclient-leaflet/lib/_mixin/WebMapBase.js");
+
+/***/ }),
+
+/***/ 505:
+/***/ (function(module, exports) {
+
+module.exports = require("@supermapgis/vue-iclient-leaflet/lib/_mixin/map-events.js");
+
+/***/ }),
+
+/***/ 506:
+/***/ (function(module, exports) {
+
+module.exports = require("@supermapgis/vue-iclient-leaflet/lib/spin");
+
+/***/ }),
+
+/***/ 51:
+/***/ (function(module, exports) {
+
+module.exports = require("@supermapgis/vue-iclient-leaflet/lib/_utils/epsg-define.js");
+
+/***/ }),
+
+/***/ 6:
+/***/ (function(module, exports) {
+
+module.exports = require("@babel/runtime/helpers/inheritsLoose");
+
+/***/ })
+
+/******/ });