m-gis-ui - npm Package Compare versions

Comparing version 1.0.2 to 1.0.3

dist/cjs/gis-ui.cjs.js

@@ -5,3 +5,3 @@ 'use strict';
 
-const index = require('./index-50e7fec3.js');
+const index = require('./index-7ae4abd2.js');
 
@@ -24,3 +24,3 @@ /*
 patchBrowser().then(options => {
-  return index.bootstrapLazy([["map-district_2.cjs",[[1,"map-district",{"visible":[4],"source":[16],"nameAlias":[1,"name-alias"],"codeAlias":[1,"code-alias"],"childrenAlias":[1,"children-alias"],"districtType":[32],"keyword":[32],"list":[32],"districtSelected":[32]}],[1,"map-toolbar",{"gis":[8],"mapInstance":[8,"map-instance"],"operations":[16],"placement":[1],"mode":[1],"actions":[16],"isClear":[4,"is-clear"],"markerIconOptions":[16],"overlayOptions":[16],"infoWindowContent":[16]}]]],["map-isochron.cjs",[[2,"map-isochron",{"name":[1],"layerList":[16],"nameAlias":[1,"name-alias"],"travel":[32],"time":[32],"dilute":[32],"layerId":[32],"allTripType":[32]}]]],["map-legend.cjs",[[0,"map-legend",{"visible":[4],"dataMap":[16],"left":[2],"bottom":[2]}]]],["map-toolbar-edit-panel.cjs",[[1,"map-toolbar-edit-panel",{"visible":[4],"actionType":[1,"action-type"],"name":[32],"description":[32]}]]]], options);
+  return index.bootstrapLazy([["map-district_2.cjs",[[1,"map-district",{"visible":[4],"source":[16],"nameAlias":[1,"name-alias"],"codeAlias":[1,"code-alias"],"childrenAlias":[1,"children-alias"],"districtType":[32],"keyword":[32],"list":[32],"districtSelected":[32]}],[1,"map-toolbar",{"gis":[8],"mapInstance":[8,"map-instance"],"visible":[4],"offset":[8],"operations":[16],"placement":[1],"mode":[1],"actions":[16],"isClear":[4,"is-clear"],"markerIconOptions":[16],"overlayOptions":[16],"infoWindowContent":[16]}]]],["map-isochron.cjs",[[6,"map-isochron",{"name":[1]}]]],["map-legend.cjs",[[0,"map-legend",{"visible":[4],"dataMap":[16],"left":[2],"bottom":[2]}]]],["map-toolbar-edit-panel.cjs",[[1,"map-toolbar-edit-panel",{"visible":[4],"actionType":[1,"action-type"],"name":[32],"description":[32]}]]]], options);
 });
@@ -27,0 +27,0 @@

dist/cjs/loader.cjs.js

@@ -5,3 +5,3 @@ 'use strict';
 
-const index = require('./index-50e7fec3.js');
+const index = require('./index-7ae4abd2.js');
 
@@ -18,3 +18,3 @@ /*
   return patchEsm().then(() => {
-  return index.bootstrapLazy([["map-district_2.cjs",[[1,"map-district",{"visible":[4],"source":[16],"nameAlias":[1,"name-alias"],"codeAlias":[1,"code-alias"],"childrenAlias":[1,"children-alias"],"districtType":[32],"keyword":[32],"list":[32],"districtSelected":[32]}],[1,"map-toolbar",{"gis":[8],"mapInstance":[8,"map-instance"],"operations":[16],"placement":[1],"mode":[1],"actions":[16],"isClear":[4,"is-clear"],"markerIconOptions":[16],"overlayOptions":[16],"infoWindowContent":[16]}]]],["map-isochron.cjs",[[2,"map-isochron",{"name":[1],"layerList":[16],"nameAlias":[1,"name-alias"],"travel":[32],"time":[32],"dilute":[32],"layerId":[32],"allTripType":[32]}]]],["map-legend.cjs",[[0,"map-legend",{"visible":[4],"dataMap":[16],"left":[2],"bottom":[2]}]]],["map-toolbar-edit-panel.cjs",[[1,"map-toolbar-edit-panel",{"visible":[4],"actionType":[1,"action-type"],"name":[32],"description":[32]}]]]], options);
+  return index.bootstrapLazy([["map-district_2.cjs",[[1,"map-district",{"visible":[4],"source":[16],"nameAlias":[1,"name-alias"],"codeAlias":[1,"code-alias"],"childrenAlias":[1,"children-alias"],"districtType":[32],"keyword":[32],"list":[32],"districtSelected":[32]}],[1,"map-toolbar",{"gis":[8],"mapInstance":[8,"map-instance"],"visible":[4],"offset":[8],"operations":[16],"placement":[1],"mode":[1],"actions":[16],"isClear":[4,"is-clear"],"markerIconOptions":[16],"overlayOptions":[16],"infoWindowContent":[16]}]]],["map-isochron.cjs",[[6,"map-isochron",{"name":[1]}]]],["map-legend.cjs",[[0,"map-legend",{"visible":[4],"dataMap":[16],"left":[2],"bottom":[2]}]]],["map-toolbar-edit-panel.cjs",[[1,"map-toolbar-edit-panel",{"visible":[4],"actionType":[1,"action-type"],"name":[32],"description":[32]}]]]], options);
   });
@@ -21,0 +21,0 @@ };

dist/cjs/map-district_2.cjs.entry.js

@@ -5,3 +5,3 @@ 'use strict';
 
-const index = require('./index-50e7fec3.js');
+const index = require('./index-7ae4abd2.js');
 
@@ -132,3 +132,3 @@ const mapDistrictCss = "@charset \"UTF-8\";.dialog{width:520px;background-color:#fff;position:fixed;left:50%;top:50%;transform:translate(-50%, -85%);z-index:40;border-radius:4px;transition:0.15s ease}.dialog-mask{position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;background-color:rgba(55, 55, 55, 0.6)}.dialog-header{position:relative;display:flex;align-items:center;justify-content:space-between;margin:0px;padding:10px 15px;box-shadow:0px 2px 4px 0px rgba(221, 221, 221, 0.5)}.dialog-close{position:absolute;right:15px;font-size:24px;color:#999;transition:color 0.2s ease}.dialog-close:hover{color:#666;cursor:pointer}.dialog-header>h3{margin-top:0;margin-bottom:0;font-size:14px;font-weight:normal;color:#2c3e50}.dialog-body{display:flex;padding-left:15px;padding-right:15px;background-color:#fafafb}.dialog-content{display:flex}.dialog-left-content{flex:1;padding-top:10px;font-size:14px;font-weight:normal;color:#515a6e;border-right:1px solid #ccc}.dialog-left-content input{float:right;margin-right:18px}.dialog-body .dialog-left-content>ul{margin-top:8px;margin-bottom:8px;padding-left:4px;height:210px;overflow-y:auto}.dialog-left-content li{position:relative}.dialog-right-content{flex:1;margin-top:13px;margin-bottom:8px;padding-left:12px}.dialog-right-content>h4{margin:0}.dialog-right-content>ul{margin-top:12px;font-size:14px;color:#333333;font-weight:normal}.dialog-right-content li{display:flex;align-items:center;justify-content:space-between}.dialog-right-content .dialog-toolbar{justify-content:space-between}.dialog-footer{padding:7px 15px;text-align:right;box-shadow:0px -2px 4px 0px rgba(216, 216, 216, 0.5)}.dialog-toolbar{display:flex;align-items:center}.dialog-toolbar>h4{margin-top:0;margin-bottom:0;color:#333;font-size:14px;font-weight:normal}.dialog-toolbar>select,.dialog-toolbar>input{height:28px;color:#555;border:none;background:#ececec;border-radius:4px}.dialog-toolbar>select{padding-left:6px;padding-right:6px}.dialog-toolbar>input{margin-left:10px;padding-left:10px;padding-right:10px;outline:none}.dialog-toolbar>select:focus-visible,.dialog-toolbar>input:focus{outline:0}.primary{margin-right:15px;color:#fff;background-color:#2d8cf0;border:1px solid #2d8cf0}.side{color:#515a6e;background-color:#fff;border:1px solid #d7dde4}.primary,.side{padding:4px 15px;border-radius:4px;font-size:14px;transition:0.2s linear}.primary:hover{background-color:#57a3f3;border-color:#57a3f3}.side:hover{color:#57a3f3;background-color:#fff;border-color:#57a3f3}.primary:hover,.side:hover{cursor:pointer}.clear{margin-right:0;border:0;padding:2px 8px;border-radius:40px;font-size:12px}.close{width:14px;height:14px;line-height:12px;border-radius:50%;background-color:#ccc;text-align:center;color:#fff;transition:all 0.15s}.close:hover{background-color:#2d8cf0;cursor:pointer}.triangle::before{content:\"\";display:inline-block;vertical-align:middle;margin-top:2px;margin-right:2px;width:4px;height:4px;border:solid #515a6e;border-width:1px 0 0 1px;transform:translate(-50%, -50%) rotate(135deg);transition:all 0.2s ease-in-out}.open::before{transform:translate(-50%, -50%) rotate(225deg)}.triangle:hover{cursor:pointer}.triangle~ul{transition:all 0.2s ease-in-out;opacity:0;visibility:hidden;height:0;overflow:hidden}.open~ul{height:auto;opacity:1;visibility:visible;overflow:inherit}.fade-in{opacity:1;visibility:visible}.fade-out{opacity:0;visibility:hidden}ul:not(:first-child){padding-left:22px;list-style:none}input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none;margin:0;position:relative;height:14px;width:14px;border-radius:50%;content:\"×\";background-color:#c2c0c0}input[type=search]::-webkit-search-cancel-button:hover{cursor:pointer}";
 
-const mapToolbarCss = ".m-toolbar{position:absolute;z-index:20;padding:2px 6px;width:max-content;background:#fff;box-shadow:0px 1px 4px 0px rgba(0, 0, 0, 0.23);border-radius:4px}.m-toolbar-left{top:15px;left:20px}.m-toolbar-right{top:15px;right:20px}.m-toolbar-center{top:15px;left:50%;transform:translateX(-50%)}.m-toolbar>button{margin:0 4px;padding:2px 0;line-height:1em;vertical-align:middle;border:none;background:transparent}.m-toolbar>button:hover{cursor:pointer}.m-toolbar img,.m-toolbar span{vertical-align:middle}.m-toolbar span{padding-left:2px}.m-tooltip>[data-tooltip]{position:relative}.m-tooltip>[data-tooltip]::before,.m-tooltip>[data-tooltip]::after{position:absolute;top:100%;left:50%;z-index:99;transition:0.2s;opacity:0}.m-tooltip>[data-tooltip]:hover::before,.m-tooltip>[data-tooltip]:hover::after{opacity:1}.m-tooltip>[data-tooltip]::before{content:\"\";transform:translatex(-50%) rotate(180deg);margin-top:5px;border-width:4px 6px 0 6px;border-style:solid;border-color:transparent;border-top-color:rgba(70, 76, 91, 0.9)}.m-tooltip>[data-tooltip]::after{content:attr(data-tooltip);transform:translatex(-50%);width:max-content;padding:6px 10px;margin-top:9px;border-radius:5px;text-align:center;color:#fff;background:rgba(70, 76, 91, 0.9);pointer-events:none}";
+const mapToolbarCss = ".m-toolbar{position:absolute;z-index:20;padding:2px 6px;width:max-content;background:#fff;box-shadow:0px 1px 4px 0px rgba(0, 0, 0, 0.23);border-radius:4px}.m-toolbar-left{left:20px}.m-toolbar-right{right:20px}.m-toolbar-center{left:50%;transform:translateX(-50%)}.m-toolbar>button{margin:0 4px;padding:2px 0;line-height:1em;vertical-align:middle;border:none;background:transparent}.m-toolbar>button:hover{cursor:pointer}.m-toolbar img,.m-toolbar span{vertical-align:middle}.m-toolbar img:hover,.m-toolbar span:hover{cursor:pointer}.m-toolbar span{padding-left:2px}.m-tooltip>[data-tooltip]{position:relative}.m-tooltip>[data-tooltip]::before,.m-tooltip>[data-tooltip]::after{position:absolute;top:100%;left:50%;z-index:99;transition:0.2s;opacity:0}.m-tooltip>[data-tooltip]:hover::before,.m-tooltip>[data-tooltip]:hover::after{opacity:1}.m-tooltip>[data-tooltip]::before{content:\"\";transform:translatex(-50%) rotate(180deg);margin-top:5px;border-width:4px 6px 0 6px;border-style:solid;border-color:transparent;border-top-color:rgba(70, 76, 91, 0.9)}.m-tooltip>[data-tooltip]::after{content:attr(data-tooltip);transform:translatex(-50%);width:max-content;padding:6px 10px;margin-top:9px;border-radius:5px;text-align:center;color:#fff;background:rgba(70, 76, 91, 0.9);pointer-events:none}";
 
@@ -153,4 +153,32 @@ const MapToolbar = class {
     };
+    /**
+     * 工具栏操作项事件委托绑定
+     */
+    this.handleToolbar = ({ target }) => {
+      const { type: actionType, id } = target.dataset;
+      const { mapInstance, overlayOptions, context: { mouseTool, rangingTool } } = this;
+      this.context.actionId = id;
+      this.clearPaintAndCloseMouseTool();
+      if (['marker', 'measureArea', 'distanceMeasurement'].includes(actionType)) {
+        mapInstance.setDefaultCursor('pointer');
+      }
+      else {
+        mapInstance.setDefaultCursor('crosshair');
+      }
+      switch (actionType) {
+        case 'marker':
+          mouseTool[actionType]({ content: '<span></span>' }); // 传入空HTML字符串，覆盖icon属性
+          break;
+        case 'distanceMeasurement':
+          rangingTool.setOptions();
+          rangingTool.turnOn();
+          break;
+        default:
+          mouseTool[actionType](overlayOptions);
+      }
+    };
     this.gis = undefined;
     this.mapInstance = undefined;
+    this.visible = false;
+    this.offset = 15;
     this.operations = [];
@@ -240,28 +268,2 @@ this.placement = 'right';
   /**
-   * 工具栏操作项事件委托绑定
-   */
-  handleToolbar({ target }) {
-    const { type: actionType, id } = target.dataset;
-    const { mapInstance, overlayOptions, context: { mouseTool, rangingTool } } = this;
-    this.context.actionId = id;
-    this.clearPaintAndCloseMouseTool();
-    if (['marker', 'measureArea', 'distanceMeasurement'].includes(actionType)) {
-      mapInstance.setDefaultCursor('pointer');
-    }
-    else {
-      mapInstance.setDefaultCursor('crosshair');
-    }
-    switch (actionType) {
-      case 'marker':
-        mouseTool[actionType]({ content: '<span></span>' }); // 传入空HTML字符串，覆盖icon属性
-        break;
-      case 'distanceMeasurement':
-        rangingTool.setOptions();
-        rangingTool.turnOn();
-        break;
-      default:
-        mouseTool[actionType](overlayOptions);
-    }
-  }
-  /**
    * 清除鼠标工具绘制的覆盖物对象并关闭当前鼠标操作
@@ -335,10 +337,12 @@ */
     const dynamicStyle = `m-toolbar ${'m-toolbar-' + this.placement} ${this.mode === 'tooltip' ? 'm-tooltip' : ''}`;
-    return (index.h("div", { class: dynamicStyle, onClick: ev => this.handleToolbar(ev) }, this.operations.map(({ id, type, name, customEvent, icon }) => {
-      if (customEvent) {
-        return (index.h("button", { type: "button", "data-tooltip": name, onClick: ev => this[customEvent](ev) }, index.h("img", { src: icon, width: 20, height: 20 }), this.mode === 'tile' && index.h("span", null, name)));
-      }
-      else {
-        return (index.h("button", { type: "button", "data-tooltip": name }, index.h("img", { "data-id": id, "data-type": type, src: icon, width: 20, height: 20 }), this.mode === 'tile' && index.h("span", { "data-id": id, "data-type": type }, name)));
-      }
-    })));
+    if (this.visible) {
+      return (index.h("div", { class: dynamicStyle, onClick: this.handleToolbar, style: { top: this.offset + 'px' } }, this.operations.map(({ id, type, name, customEvent, icon }) => {
+        if (customEvent) {
+          return (index.h("button", { type: "button", "data-tooltip": name, onClick: ev => this[customEvent](ev) }, index.h("img", { src: icon, width: 20, height: 20 }), this.mode === 'tile' && index.h("span", null, name)));
+        }
+        else {
+          return (index.h("button", { type: "button", "data-tooltip": name }, index.h("img", { "data-id": id, "data-type": type, src: icon, width: 20, height: 20 }), this.mode === 'tile' && index.h("span", { "data-id": id, "data-type": type }, name)));
+        }
+      })));
+    }
   }
@@ -345,0 +349,0 @@ };

dist/cjs/map-isochron.cjs.entry.js

@@ -5,5 +5,5 @@ 'use strict';
 
-const index = require('./index-50e7fec3.js');
+const index = require('./index-7ae4abd2.js');
 
-const mapIsochronCss = "*.sc-map-isochron{padding:0;margin:0}.chron-page.sc-map-isochron{width:336px;background:#fff;font-size:14px;color:#333333;position:relative;border-radius:4px;box-shadow:0 1px 2px rgba(0, 0, 0, 0.1)}.page-title.sc-map-isochron{text-align:center;padding-top:10px}.form.sc-map-isochron{padding:15px}.form.sc-map-isochron>label.sc-map-isochron{display:block;font-size:14px;color:#333333;font-weight:normal;margin-bottom:12px}.form.sc-map-isochron>label.sc-map-isochron span.sc-map-isochron{width:100px;display:inline-block}.form.sc-map-isochron>label.sc-map-isochron .rate-num.sc-map-isochron{display:inline-block;margin-left:6px;width:20px}.form.sc-map-isochron input[type=text].sc-map-isochron,.form.sc-map-isochron input[type=number].sc-map-isochron{width:180px;display:inline-block;padding:6px 8px;border:1px solid #dcdee2;border-radius:4px;transition:0.2s linear;box-sizing:border-box;color:#555}.form.sc-map-isochron input[type=text].sc-map-isochron:focus,.form.sc-map-isochron input[type=text].sc-map-isochron:hover,.form.sc-map-isochron input[type=number].sc-map-isochron:focus,.form.sc-map-isochron input[type=number].sc-map-isochron:hover{outline:0;border-color:#57a3f3;box-shadow:0 0 0 0.010417rem rgba(45, 140, 240, 0.2)}.form.sc-map-isochron input[type=number].sc-map-isochron{height:28px}.form.sc-map-isochron input[type=range].sc-map-isochron{width:180px;vertical-align:middle;margin-top:-3px}.form.sc-map-isochron select.sc-map-isochron{width:180px;padding:0 8px}.page-footer.sc-map-isochron{padding:0 15px 20px;text-align:center;border-bottom-left-radius:4px;border-bottom-right-radius:4px}.primary.sc-map-isochron{margin-right:15px;color:#fff;background-color:#2d8cf0;border:1px solid #2d8cf0}.side.sc-map-isochron{color:#515a6e;background-color:#fff;border:1px solid #d7dde4}.primary.sc-map-isochron,.side.sc-map-isochron{padding:4px 15px;border-radius:4px;font-size:14px;transition:0.2s linear}.primary.sc-map-isochron:hover{background-color:#57a3f3;border-color:#57a3f3}.side.sc-map-isochron:hover{color:#57a3f3;background-color:#fff;border-color:#57a3f3}.primary.sc-map-isochron:hover,.side.sc-map-isochron:hover{cursor:pointer}.info-sharp.sc-map-isochron{position:absolute;margin-left:-8px;border-left:8px solid transparent;border-right:8px solid transparent;left:50%;border-top:8px solid #fff}.info-sharp.sc-map-isochron::after{box-sizing:border-box;margin-left:-8px;border-left:8px solid transparent;border-right:8px solid transparent;position:absolute;content:\"\";margin-top:-7px;border-top:8px solid rgba(0, 0, 0, 0.3);filter:blur(2px);z-index:-1}";
+const mapIsochronCss = "*.sc-map-isochron{padding:0;margin:0}.chron-page.sc-map-isochron{width:336px;background:#fff;font-size:14px;color:#333333;position:relative;border-radius:4px;box-shadow:0 1px 2px rgba(0, 0, 0, 0.1)}.page-title.sc-map-isochron{text-align:center;padding-top:10px}.form.sc-map-isochron{padding:15px}.form.sc-map-isochron>label.sc-map-isochron{display:block;font-size:14px;color:#333333;font-weight:normal;margin-bottom:12px}.form.sc-map-isochron>label.sc-map-isochron span.sc-map-isochron{width:100px;display:inline-block}.form.sc-map-isochron>label.sc-map-isochron .name.sc-map-isochron{display:inline-block;width:180px;vertical-align:middle;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.form.sc-map-isochron>label.sc-map-isochron .rate-num.sc-map-isochron{display:inline-block;margin-left:6px;width:20px}.form.sc-map-isochron input[type=text].sc-map-isochron,.form.sc-map-isochron input[type=number].sc-map-isochron{width:180px;display:inline-block;padding:6px 8px;border:1px solid #dcdee2;border-radius:4px;transition:0.2s linear;box-sizing:border-box;color:#555}.form.sc-map-isochron input[type=text].sc-map-isochron:focus,.form.sc-map-isochron input[type=text].sc-map-isochron:hover,.form.sc-map-isochron input[type=number].sc-map-isochron:focus,.form.sc-map-isochron input[type=number].sc-map-isochron:hover{outline:0;border-color:#57a3f3;box-shadow:0 0 0 0.010417rem rgba(45, 140, 240, 0.2)}.form.sc-map-isochron input[type=number].sc-map-isochron{height:28px}.form.sc-map-isochron input[type=range].sc-map-isochron{width:180px;vertical-align:middle;margin-top:-3px}.form.sc-map-isochron select.sc-map-isochron{width:180px;padding:0 8px}.form.sc-map-isochron .error.sc-map-isochron{color:#f56c6c;margin-left:100px;font-size:12px;margin-top:4px}.page-footer.sc-map-isochron{padding:0 15px 20px;text-align:center;border-bottom-left-radius:4px;border-bottom-right-radius:4px}.primary.sc-map-isochron{margin-right:15px;color:#fff;background-color:#2d8cf0;border:1px solid #2d8cf0}.side.sc-map-isochron{color:#515a6e;background-color:#fff;border:1px solid #d7dde4}.primary.sc-map-isochron,.side.sc-map-isochron{padding:4px 15px;border-radius:4px;font-size:14px;transition:0.2s linear}.primary.sc-map-isochron:hover{background-color:#57a3f3;border-color:#57a3f3}.side.sc-map-isochron:hover{color:#57a3f3;background-color:#fff;border-color:#57a3f3}.primary.sc-map-isochron:hover,.side.sc-map-isochron:hover{cursor:pointer}.info-sharp.sc-map-isochron{position:absolute;margin-left:-8px;border-left:8px solid transparent;border-right:8px solid transparent;left:50%;border-top:8px solid #fff}.info-sharp.sc-map-isochron::after{box-sizing:border-box;margin-left:-8px;border-left:8px solid transparent;border-right:8px solid transparent;position:absolute;content:\"\";margin-top:-7px;border-top:8px solid rgba(0, 0, 0, 0.3);filter:blur(2px);z-index:-1}";
 
@@ -15,34 +15,8 @@ const MapIsochron = class {
     this.cancel = index.createEvent(this, "cancel", 7);
-    this.name = undefined;
-    this.layerList = [];
-    this.nameAlias = 'name';
-    this.travel = undefined;
-    this.time = undefined;
-    this.dilute = 50;
-    this.layerId = undefined;
-    this.allTripType = [
-      {
-        id: undefined, name: '请选择交通方式'
-      },
-      {
-        id: 'walking', name: '步行'
-      },
-      {
-        id: 'cycling', name: '骑行'
-      },
-      {
-        id: 'driving', name: '驾车'
-      }
-    ];
+    this.name = '生成等时圈';
   }
-  handelChange(event, field) {
-    this[field] = event.target.value;
-  }
-  chouxiChange(event) {
-    console.log('chouxiChange', event);
-    this.dilute = event.target.value;
-  }
   confirmHandler(event) {
     event.stopPropagation();
-    this.confirm.emit({ name: this.name, travel: this.travel, time: this.time, dilute: this.dilute, layer: this.layerId });
+    this.confirm.emit();
+    // this.confirm.emit({ name: this.name, travel: this.travel, time: this.time, dilute: this.dilute, layer: this.layerId })
   }
@@ -54,8 +28,8 @@ cancelHandler(event) {
   componentWillLoad() {
-    if (this.layerList.filter(item => item.id).length === this.layerList.length) {
-      this.layerList = [{ id: undefined, name: '请选择图层' }].concat(this.layerList);
-    }
+    // if (this.layerList.filter(item => item.id).length === this.layerList.length) {
+    //   this.layerList = [{ id: undefined, name: '请选择图层' }].concat(this.layerList)
+    // }
   }
   render() {
-    return (index.h("div", { class: "chron-page", id: "isochron" }, index.h("h3", { class: "page-title" }, "\u751F\u6210\u7B49\u65F6\u5708"), index.h("div", { class: "page-body" }, index.h("form", { class: "form" }, index.h("label", null, index.h("span", null, "\u4E2D\u5FC3\u70B9\u4F4D\u7F6E\uFF1A"), index.h("span", null, this.name)), index.h("label", null, index.h("span", null, "\u4EA4\u901A\u65B9\u5F0F\uFF1A"), index.h("select", { onInput: (event) => this.handelChange(event, 'travel') }, this.allTripType.map(type => (index.h("option", { value: type.id, selected: this.travel === type.id }, type.name))))), index.h("label", null, index.h("span", null, "\u901A\u884C\u65F6\u957F\uFF1A"), index.h("input", { type: "number", onInput: (event) => this.handelChange(event, 'time'), min: "1", max: "60", value: this.time, placeholder: "1-60min" })), index.h("label", null, index.h("span", null, "\u62BD\u7A00\u7387\uFF1A"), index.h("input", { type: "range", min: "0", max: "100", step: "1", value: this.dilute, onChange: (event) => this.chouxiChange(event) }), index.h("span", { class: "rate-num" }, this.dilute, "%")), index.h("label", null, index.h("span", null, "\u4FDD\u5B58\u81F3\u56FE\u5C42\uFF1A"), index.h("select", { onInput: (event) => this.handelChange(event, 'layerId') }, this.layerList.map(layer => (index.h("option", { value: layer.id, selected: this.layerId === layer.id }, layer.name))))))), index.h("div", { class: "page-footer" }, index.h("button", { type: "button", class: "primary", onClick: (event) => this.confirmHandler(event) }, "\u786E\u5B9A"), index.h("button", { type: "button", class: "side", onClick: (event) => this.cancelHandler(event) }, "\u53D6\u6D88")), index.h("div", { class: "info-sharp" })));
+    return (index.h("div", { class: "chron-page", id: "isochron" }, index.h("h3", { class: "page-title" }, this.name), index.h("div", { class: "page-body" }, index.h("slot", null)), index.h("div", { class: "page-footer" }, index.h("button", { type: "button", class: "primary", onClick: (event) => this.confirmHandler(event) }, "\u786E\u5B9A"), index.h("button", { type: "button", class: "side", onClick: (event) => this.cancelHandler(event) }, "\u53D6\u6D88")), index.h("div", { class: "info-sharp" })));
   }
@@ -62,0 +36,0 @@ };

dist/cjs/map-legend.cjs.entry.js

@@ -5,3 +5,3 @@ 'use strict';
 
-const index = require('./index-50e7fec3.js');
+const index = require('./index-7ae4abd2.js');
 
@@ -8,0 +8,0 @@ const mapLegendCss = ":host{display:block}.legend-box{position:absolute;bottom:40px;left:40px;font-size:12px;color:#333;padding:10px;background:#fff;border-radius:4px}.legend-box>div{line-height:2}.legend-box .legend-icon{display:inline-block;width:30px;height:8px;margin-right:8px}";

dist/cjs/map-toolbar-edit-panel.cjs.entry.js

@@ -5,3 +5,3 @@ 'use strict';
 
-const index = require('./index-50e7fec3.js');
+const index = require('./index-7ae4abd2.js');
 
@@ -8,0 +8,0 @@ const mapToolbarEditPanelCss = ".panel{position:absolute;top:52px;right:20px;bottom:15px;width:328px;background-color:#fff;border:1px solid #ccc;border-radius:4px;box-sizing:border-box;box-shadow:rgba(0, 0, 0, 0.23) 0px 1px 4px 0px;transition:0.15s ease}.panel-title{margin:0;padding:10px 15px;border-bottom:1px solid #ccc;color:#2c3e50;font-size:14px;font-weight:normal}.panel-body{padding:15px;overflow-y:auto;height:calc(100% - 113px)}.panel-footer{position:absolute;right:0;left:0;bottom:0;padding:7px 15px;border-top:1px solid #ccc;text-align:right;background-color:#f5f5f5;border-bottom-left-radius:4px;border-bottom-right-radius:4px}.form>label{display:flex;align-items:center;margin-bottom:12px;font-size:14px;color:#333;font-weight:normal}.form>label>input{flex:1;width:100%;padding:6px 8px;border:1px solid #dcdee2;border-radius:4px;transition:0.2s linear;box-sizing:border-box;color:#555}.form input:focus,.form input:hover{outline:0;border-color:#57a3f3;box-shadow:0 0 0 0.010417rem rgba(45, 140, 240, 0.2)}.primary{margin-right:15px;color:#fff;background-color:#2d8cf0;border:1px solid #2d8cf0}.side{color:#515a6e;background-color:#fff;border:1px solid #d7dde4}.primary,.side{padding:4px 15px;border-radius:4px;font-size:14px;transition:0.2s linear}.primary:hover{background-color:#57a3f3;border-color:#57a3f3}.side:hover{color:#57a3f3;background-color:#fff;border-color:#57a3f3}.primary:hover,.side:hover{cursor:pointer}.fade-in{opacity:1;visibility:visible}.fade-out{opacity:0;visibility:hidden}";

dist/collection/components/map-isochron/map-isochron.js

 import { h } from '@stencil/core';
 export class MapIsochron {
   constructor() {
-    this.name = undefined;
-    this.layerList = [];
-    this.nameAlias = 'name';
-    this.travel = undefined;
-    this.time = undefined;
-    this.dilute = 50;
-    this.layerId = undefined;
-    this.allTripType = [
-      {
-        id: undefined, name: '请选择交通方式'
-      },
-      {
-        id: 'walking', name: '步行'
-      },
-      {
-        id: 'cycling', name: '骑行'
-      },
-      {
-        id: 'driving', name: '驾车'
-      }
-    ];
+    this.name = '生成等时圈';
   }
-  handelChange(event, field) {
-    this[field] = event.target.value;
-  }
-  chouxiChange(event) {
-    console.log('chouxiChange', event);
-    this.dilute = event.target.value;
-  }
   confirmHandler(event) {
     event.stopPropagation();
-    this.confirm.emit({ name: this.name, travel: this.travel, time: this.time, dilute: this.dilute, layer: this.layerId });
+    this.confirm.emit();
+    // this.confirm.emit({ name: this.name, travel: this.travel, time: this.time, dilute: this.dilute, layer: this.layerId })
   }
@@ -42,8 +16,8 @@ cancelHandler(event) {
   componentWillLoad() {
-    if (this.layerList.filter(item => item.id).length === this.layerList.length) {
-      this.layerList = [{ id: undefined, name: '请选择图层' }].concat(this.layerList);
-    }
+    // if (this.layerList.filter(item => item.id).length === this.layerList.length) {
+    //   this.layerList = [{ id: undefined, name: '请选择图层' }].concat(this.layerList)
+    // }
   }
   render() {
-    return (h("div", { class: "chron-page", id: "isochron" }, h("h3", { class: "page-title" }, "\u751F\u6210\u7B49\u65F6\u5708"), h("div", { class: "page-body" }, h("form", { class: "form" }, h("label", null, h("span", null, "\u4E2D\u5FC3\u70B9\u4F4D\u7F6E\uFF1A"), h("span", null, this.name)), h("label", null, h("span", null, "\u4EA4\u901A\u65B9\u5F0F\uFF1A"), h("select", { onInput: (event) => this.handelChange(event, 'travel') }, this.allTripType.map(type => (h("option", { value: type.id, selected: this.travel === type.id }, type.name))))), h("label", null, h("span", null, "\u901A\u884C\u65F6\u957F\uFF1A"), h("input", { type: "number", onInput: (event) => this.handelChange(event, 'time'), min: "1", max: "60", value: this.time, placeholder: "1-60min" })), h("label", null, h("span", null, "\u62BD\u7A00\u7387\uFF1A"), h("input", { type: "range", min: "0", max: "100", step: "1", value: this.dilute, onChange: (event) => this.chouxiChange(event) }), h("span", { class: "rate-num" }, this.dilute, "%")), h("label", null, h("span", null, "\u4FDD\u5B58\u81F3\u56FE\u5C42\uFF1A"), h("select", { onInput: (event) => this.handelChange(event, 'layerId') }, this.layerList.map(layer => (h("option", { value: layer.id, selected: this.layerId === layer.id }, layer.name))))))), h("div", { class: "page-footer" }, h("button", { type: "button", class: "primary", onClick: (event) => this.confirmHandler(event) }, "\u786E\u5B9A"), h("button", { type: "button", class: "side", onClick: (event) => this.cancelHandler(event) }, "\u53D6\u6D88")), h("div", { class: "info-sharp" })));
+    return (h("div", { class: "chron-page", id: "isochron" }, h("h3", { class: "page-title" }, this.name), h("div", { class: "page-body" }, h("slot", null)), h("div", { class: "page-footer" }, h("button", { type: "button", class: "primary", onClick: (event) => this.confirmHandler(event) }, "\u786E\u5B9A"), h("button", { type: "button", class: "side", onClick: (event) => this.cancelHandler(event) }, "\u53D6\u6D88")), h("div", { class: "info-sharp" })));
   }
@@ -72,56 +46,14 @@ static get is() { return "map-isochron"; }
         },
-        "required": true,
+        "required": false,
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "\u4E2D\u5FC3\u70B9\u4F4D\u7F6E\u540D\u79F0"
+          "text": "title"
         },
         "attribute": "name",
-        "reflect": false
-      },
-      "layerList": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "any[]",
-          "resolved": "any[]",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "\u56FE\u5C42\u5217\u8868"
-        },
-        "defaultValue": "[]"
-      },
-      "nameAlias": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "\u56FE\u5C42name\u522B\u540D"
-        },
-        "attribute": "name-alias",
         "reflect": false,
-        "defaultValue": "'name'"
+        "defaultValue": "'\u751F\u6210\u7B49\u65F6\u5708'"
       }
     };
   }
-  static get states() {
-    return {
-      "travel": {},
-      "time": {},
-      "dilute": {},
-      "layerId": {},
-      "allTripType": {}
-    };
-  }
   static get events() {
@@ -128,0 +60,0 @@ return [{

dist/collection/components/map-toolbar/map-toolbar.js

@@ -17,4 +17,32 @@ import { h } from '@stencil/core';
     };
+    /**
+     * 工具栏操作项事件委托绑定
+     */
+    this.handleToolbar = ({ target }) => {
+      const { type: actionType, id } = target.dataset;
+      const { mapInstance, overlayOptions, context: { mouseTool, rangingTool } } = this;
+      this.context.actionId = id;
+      this.clearPaintAndCloseMouseTool();
+      if (['marker', 'measureArea', 'distanceMeasurement'].includes(actionType)) {
+        mapInstance.setDefaultCursor('pointer');
+      }
+      else {
+        mapInstance.setDefaultCursor('crosshair');
+      }
+      switch (actionType) {
+        case 'marker':
+          mouseTool[actionType]({ content: '<span></span>' }); // 传入空HTML字符串，覆盖icon属性
+          break;
+        case 'distanceMeasurement':
+          rangingTool.setOptions();
+          rangingTool.turnOn();
+          break;
+        default:
+          mouseTool[actionType](overlayOptions);
+      }
+    };
     this.gis = undefined;
     this.mapInstance = undefined;
+    this.visible = false;
+    this.offset = 15;
     this.operations = [];
@@ -104,28 +132,2 @@ this.placement = 'right';
   /**
-   * 工具栏操作项事件委托绑定
-   */
-  handleToolbar({ target }) {
-    const { type: actionType, id } = target.dataset;
-    const { mapInstance, overlayOptions, context: { mouseTool, rangingTool } } = this;
-    this.context.actionId = id;
-    this.clearPaintAndCloseMouseTool();
-    if (['marker', 'measureArea', 'distanceMeasurement'].includes(actionType)) {
-      mapInstance.setDefaultCursor('pointer');
-    }
-    else {
-      mapInstance.setDefaultCursor('crosshair');
-    }
-    switch (actionType) {
-      case 'marker':
-        mouseTool[actionType]({ content: '<span></span>' }); // 传入空HTML字符串，覆盖icon属性
-        break;
-      case 'distanceMeasurement':
-        rangingTool.setOptions();
-        rangingTool.turnOn();
-        break;
-      default:
-        mouseTool[actionType](overlayOptions);
-    }
-  }
-  /**
    * 清除鼠标工具绘制的覆盖物对象并关闭当前鼠标操作
@@ -199,10 +201,12 @@ */
     const dynamicStyle = `m-toolbar ${'m-toolbar-' + this.placement} ${this.mode === 'tooltip' ? 'm-tooltip' : ''}`;
-    return (h("div", { class: dynamicStyle, onClick: ev => this.handleToolbar(ev) }, this.operations.map(({ id, type, name, customEvent, icon }) => {
-      if (customEvent) {
-        return (h("button", { type: "button", "data-tooltip": name, onClick: ev => this[customEvent](ev) }, h("img", { src: icon, width: 20, height: 20 }), this.mode === 'tile' && h("span", null, name)));
-      }
-      else {
-        return (h("button", { type: "button", "data-tooltip": name }, h("img", { "data-id": id, "data-type": type, src: icon, width: 20, height: 20 }), this.mode === 'tile' && h("span", { "data-id": id, "data-type": type }, name)));
-      }
-    })));
+    if (this.visible) {
+      return (h("div", { class: dynamicStyle, onClick: this.handleToolbar, style: { top: this.offset + 'px' } }, this.operations.map(({ id, type, name, customEvent, icon }) => {
+        if (customEvent) {
+          return (h("button", { type: "button", "data-tooltip": name, onClick: ev => this[customEvent](ev) }, h("img", { src: icon, width: 20, height: 20 }), this.mode === 'tile' && h("span", null, name)));
+        }
+        else {
+          return (h("button", { type: "button", "data-tooltip": name }, h("img", { "data-id": id, "data-type": type, src: icon, width: 20, height: 20 }), this.mode === 'tile' && h("span", { "data-id": id, "data-type": type }, name)));
+        }
+      })));
+    }
   }
@@ -235,3 +239,3 @@ static get is() { return "map-toolbar"; }
           "tags": [],
-          "text": "\u5730\u56FE\u6E90\u5BF9\u8C61"
+          "text": "\u5730\u56FE\u57FA\u7840\u5E93\u6E90\u5BF9\u8C61"
         },
@@ -258,2 +262,38 @@ "attribute": "gis",
       },
+      "visible": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "\u7EC4\u4EF6\u663E\u793A\u72B6\u6001"
+        },
+        "attribute": "visible",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "offset": {
+        "type": "any",
+        "mutable": false,
+        "complexType": {
+          "original": "number | string",
+          "resolved": "number | string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "\u7EC4\u4EF6\u8DDD\u79BB\u76F8\u5BF9\u5BB9\u5668\u7684\u9876\u90E8\u504F\u79FB\u91CF"
+        },
+        "attribute": "offset",
+        "reflect": false,
+        "defaultValue": "15"
+      },
       "operations": {
@@ -268,3 +308,3 @@ "type": "unknown",
         "required": false,
-        "optional": false,
+        "optional": true,
         "docs": {
@@ -285,3 +325,3 @@ "tags": [],
         "required": false,
-        "optional": false,
+        "optional": true,
         "docs": {
@@ -304,3 +344,3 @@ "tags": [],
         "required": false,
-        "optional": false,
+        "optional": true,
         "docs": {
@@ -323,3 +363,3 @@ "tags": [],
         "required": false,
-        "optional": false,
+        "optional": true,
         "docs": {
@@ -340,3 +380,3 @@ "tags": [],
         "required": false,
-        "optional": false,
+        "optional": true,
         "docs": {
@@ -386,6 +426,6 @@ "tags": [],
         "complexType": {
-          "original": "Element",
-          "resolved": "Element",
+          "original": "HTMLElement",
+          "resolved": "HTMLElement",
           "references": {
-            "Element": {
+            "HTMLElement": {
               "location": "global"
@@ -396,3 +436,3 @@ }
         "required": false,
-        "optional": false,
+        "optional": true,
         "docs": {
@@ -399,0 +439,0 @@ "tags": [],

dist/components/map-isochron.js

 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
 
-const mapIsochronCss = "*.sc-map-isochron{padding:0;margin:0}.chron-page.sc-map-isochron{width:336px;background:#fff;font-size:14px;color:#333333;position:relative;border-radius:4px;box-shadow:0 1px 2px rgba(0, 0, 0, 0.1)}.page-title.sc-map-isochron{text-align:center;padding-top:10px}.form.sc-map-isochron{padding:15px}.form.sc-map-isochron>label.sc-map-isochron{display:block;font-size:14px;color:#333333;font-weight:normal;margin-bottom:12px}.form.sc-map-isochron>label.sc-map-isochron span.sc-map-isochron{width:100px;display:inline-block}.form.sc-map-isochron>label.sc-map-isochron .rate-num.sc-map-isochron{display:inline-block;margin-left:6px;width:20px}.form.sc-map-isochron input[type=text].sc-map-isochron,.form.sc-map-isochron input[type=number].sc-map-isochron{width:180px;display:inline-block;padding:6px 8px;border:1px solid #dcdee2;border-radius:4px;transition:0.2s linear;box-sizing:border-box;color:#555}.form.sc-map-isochron input[type=text].sc-map-isochron:focus,.form.sc-map-isochron input[type=text].sc-map-isochron:hover,.form.sc-map-isochron input[type=number].sc-map-isochron:focus,.form.sc-map-isochron input[type=number].sc-map-isochron:hover{outline:0;border-color:#57a3f3;box-shadow:0 0 0 0.010417rem rgba(45, 140, 240, 0.2)}.form.sc-map-isochron input[type=number].sc-map-isochron{height:28px}.form.sc-map-isochron input[type=range].sc-map-isochron{width:180px;vertical-align:middle;margin-top:-3px}.form.sc-map-isochron select.sc-map-isochron{width:180px;padding:0 8px}.page-footer.sc-map-isochron{padding:0 15px 20px;text-align:center;border-bottom-left-radius:4px;border-bottom-right-radius:4px}.primary.sc-map-isochron{margin-right:15px;color:#fff;background-color:#2d8cf0;border:1px solid #2d8cf0}.side.sc-map-isochron{color:#515a6e;background-color:#fff;border:1px solid #d7dde4}.primary.sc-map-isochron,.side.sc-map-isochron{padding:4px 15px;border-radius:4px;font-size:14px;transition:0.2s linear}.primary.sc-map-isochron:hover{background-color:#57a3f3;border-color:#57a3f3}.side.sc-map-isochron:hover{color:#57a3f3;background-color:#fff;border-color:#57a3f3}.primary.sc-map-isochron:hover,.side.sc-map-isochron:hover{cursor:pointer}.info-sharp.sc-map-isochron{position:absolute;margin-left:-8px;border-left:8px solid transparent;border-right:8px solid transparent;left:50%;border-top:8px solid #fff}.info-sharp.sc-map-isochron::after{box-sizing:border-box;margin-left:-8px;border-left:8px solid transparent;border-right:8px solid transparent;position:absolute;content:\"\";margin-top:-7px;border-top:8px solid rgba(0, 0, 0, 0.3);filter:blur(2px);z-index:-1}";
+const mapIsochronCss = "*.sc-map-isochron{padding:0;margin:0}.chron-page.sc-map-isochron{width:336px;background:#fff;font-size:14px;color:#333333;position:relative;border-radius:4px;box-shadow:0 1px 2px rgba(0, 0, 0, 0.1)}.page-title.sc-map-isochron{text-align:center;padding-top:10px}.form.sc-map-isochron{padding:15px}.form.sc-map-isochron>label.sc-map-isochron{display:block;font-size:14px;color:#333333;font-weight:normal;margin-bottom:12px}.form.sc-map-isochron>label.sc-map-isochron span.sc-map-isochron{width:100px;display:inline-block}.form.sc-map-isochron>label.sc-map-isochron .name.sc-map-isochron{display:inline-block;width:180px;vertical-align:middle;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.form.sc-map-isochron>label.sc-map-isochron .rate-num.sc-map-isochron{display:inline-block;margin-left:6px;width:20px}.form.sc-map-isochron input[type=text].sc-map-isochron,.form.sc-map-isochron input[type=number].sc-map-isochron{width:180px;display:inline-block;padding:6px 8px;border:1px solid #dcdee2;border-radius:4px;transition:0.2s linear;box-sizing:border-box;color:#555}.form.sc-map-isochron input[type=text].sc-map-isochron:focus,.form.sc-map-isochron input[type=text].sc-map-isochron:hover,.form.sc-map-isochron input[type=number].sc-map-isochron:focus,.form.sc-map-isochron input[type=number].sc-map-isochron:hover{outline:0;border-color:#57a3f3;box-shadow:0 0 0 0.010417rem rgba(45, 140, 240, 0.2)}.form.sc-map-isochron input[type=number].sc-map-isochron{height:28px}.form.sc-map-isochron input[type=range].sc-map-isochron{width:180px;vertical-align:middle;margin-top:-3px}.form.sc-map-isochron select.sc-map-isochron{width:180px;padding:0 8px}.form.sc-map-isochron .error.sc-map-isochron{color:#f56c6c;margin-left:100px;font-size:12px;margin-top:4px}.page-footer.sc-map-isochron{padding:0 15px 20px;text-align:center;border-bottom-left-radius:4px;border-bottom-right-radius:4px}.primary.sc-map-isochron{margin-right:15px;color:#fff;background-color:#2d8cf0;border:1px solid #2d8cf0}.side.sc-map-isochron{color:#515a6e;background-color:#fff;border:1px solid #d7dde4}.primary.sc-map-isochron,.side.sc-map-isochron{padding:4px 15px;border-radius:4px;font-size:14px;transition:0.2s linear}.primary.sc-map-isochron:hover{background-color:#57a3f3;border-color:#57a3f3}.side.sc-map-isochron:hover{color:#57a3f3;background-color:#fff;border-color:#57a3f3}.primary.sc-map-isochron:hover,.side.sc-map-isochron:hover{cursor:pointer}.info-sharp.sc-map-isochron{position:absolute;margin-left:-8px;border-left:8px solid transparent;border-right:8px solid transparent;left:50%;border-top:8px solid #fff}.info-sharp.sc-map-isochron::after{box-sizing:border-box;margin-left:-8px;border-left:8px solid transparent;border-right:8px solid transparent;position:absolute;content:\"\";margin-top:-7px;border-top:8px solid rgba(0, 0, 0, 0.3);filter:blur(2px);z-index:-1}";
 
@@ -11,34 +11,8 @@ const MapIsochron$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.cancel = createEvent(this, "cancel", 7);
-    this.name = undefined;
-    this.layerList = [];
-    this.nameAlias = 'name';
-    this.travel = undefined;
-    this.time = undefined;
-    this.dilute = 50;
-    this.layerId = undefined;
-    this.allTripType = [
-      {
-        id: undefined, name: '请选择交通方式'
-      },
-      {
-        id: 'walking', name: '步行'
-      },
-      {
-        id: 'cycling', name: '骑行'
-      },
-      {
-        id: 'driving', name: '驾车'
-      }
-    ];
+    this.name = '生成等时圈';
   }
-  handelChange(event, field) {
-    this[field] = event.target.value;
-  }
-  chouxiChange(event) {
-    console.log('chouxiChange', event);
-    this.dilute = event.target.value;
-  }
   confirmHandler(event) {
     event.stopPropagation();
-    this.confirm.emit({ name: this.name, travel: this.travel, time: this.time, dilute: this.dilute, layer: this.layerId });
+    this.confirm.emit();
+    // this.confirm.emit({ name: this.name, travel: this.travel, time: this.time, dilute: this.dilute, layer: this.layerId })
   }
@@ -50,19 +24,12 @@ cancelHandler(event) {
   componentWillLoad() {
-    if (this.layerList.filter(item => item.id).length === this.layerList.length) {
-      this.layerList = [{ id: undefined, name: '请选择图层' }].concat(this.layerList);
-    }
+    // if (this.layerList.filter(item => item.id).length === this.layerList.length) {
+    //   this.layerList = [{ id: undefined, name: '请选择图层' }].concat(this.layerList)
+    // }
   }
   render() {
-    return (h("div", { class: "chron-page", id: "isochron" }, h("h3", { class: "page-title" }, "\u751F\u6210\u7B49\u65F6\u5708"), h("div", { class: "page-body" }, h("form", { class: "form" }, h("label", null, h("span", null, "\u4E2D\u5FC3\u70B9\u4F4D\u7F6E\uFF1A"), h("span", null, this.name)), h("label", null, h("span", null, "\u4EA4\u901A\u65B9\u5F0F\uFF1A"), h("select", { onInput: (event) => this.handelChange(event, 'travel') }, this.allTripType.map(type => (h("option", { value: type.id, selected: this.travel === type.id }, type.name))))), h("label", null, h("span", null, "\u901A\u884C\u65F6\u957F\uFF1A"), h("input", { type: "number", onInput: (event) => this.handelChange(event, 'time'), min: "1", max: "60", value: this.time, placeholder: "1-60min" })), h("label", null, h("span", null, "\u62BD\u7A00\u7387\uFF1A"), h("input", { type: "range", min: "0", max: "100", step: "1", value: this.dilute, onChange: (event) => this.chouxiChange(event) }), h("span", { class: "rate-num" }, this.dilute, "%")), h("label", null, h("span", null, "\u4FDD\u5B58\u81F3\u56FE\u5C42\uFF1A"), h("select", { onInput: (event) => this.handelChange(event, 'layerId') }, this.layerList.map(layer => (h("option", { value: layer.id, selected: this.layerId === layer.id }, layer.name))))))), h("div", { class: "page-footer" }, h("button", { type: "button", class: "primary", onClick: (event) => this.confirmHandler(event) }, "\u786E\u5B9A"), h("button", { type: "button", class: "side", onClick: (event) => this.cancelHandler(event) }, "\u53D6\u6D88")), h("div", { class: "info-sharp" })));
+    return (h("div", { class: "chron-page", id: "isochron" }, h("h3", { class: "page-title" }, this.name), h("div", { class: "page-body" }, h("slot", null)), h("div", { class: "page-footer" }, h("button", { type: "button", class: "primary", onClick: (event) => this.confirmHandler(event) }, "\u786E\u5B9A"), h("button", { type: "button", class: "side", onClick: (event) => this.cancelHandler(event) }, "\u53D6\u6D88")), h("div", { class: "info-sharp" })));
   }
   static get style() { return mapIsochronCss; }
-}, [2, "map-isochron", {
-    "name": [1],
-    "layerList": [16],
-    "nameAlias": [1, "name-alias"],
-    "travel": [32],
-    "time": [32],
-    "dilute": [32],
-    "layerId": [32],
-    "allTripType": [32]
+}, [6, "map-isochron", {
+    "name": [1]
   }]);
@@ -69,0 +36,0 @@ function defineCustomElement$1() {

dist/components/map-toolbar.js

 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
 
-const mapToolbarCss = ".m-toolbar{position:absolute;z-index:20;padding:2px 6px;width:max-content;background:#fff;box-shadow:0px 1px 4px 0px rgba(0, 0, 0, 0.23);border-radius:4px}.m-toolbar-left{top:15px;left:20px}.m-toolbar-right{top:15px;right:20px}.m-toolbar-center{top:15px;left:50%;transform:translateX(-50%)}.m-toolbar>button{margin:0 4px;padding:2px 0;line-height:1em;vertical-align:middle;border:none;background:transparent}.m-toolbar>button:hover{cursor:pointer}.m-toolbar img,.m-toolbar span{vertical-align:middle}.m-toolbar span{padding-left:2px}.m-tooltip>[data-tooltip]{position:relative}.m-tooltip>[data-tooltip]::before,.m-tooltip>[data-tooltip]::after{position:absolute;top:100%;left:50%;z-index:99;transition:0.2s;opacity:0}.m-tooltip>[data-tooltip]:hover::before,.m-tooltip>[data-tooltip]:hover::after{opacity:1}.m-tooltip>[data-tooltip]::before{content:\"\";transform:translatex(-50%) rotate(180deg);margin-top:5px;border-width:4px 6px 0 6px;border-style:solid;border-color:transparent;border-top-color:rgba(70, 76, 91, 0.9)}.m-tooltip>[data-tooltip]::after{content:attr(data-tooltip);transform:translatex(-50%);width:max-content;padding:6px 10px;margin-top:9px;border-radius:5px;text-align:center;color:#fff;background:rgba(70, 76, 91, 0.9);pointer-events:none}";
+const mapToolbarCss = ".m-toolbar{position:absolute;z-index:20;padding:2px 6px;width:max-content;background:#fff;box-shadow:0px 1px 4px 0px rgba(0, 0, 0, 0.23);border-radius:4px}.m-toolbar-left{left:20px}.m-toolbar-right{right:20px}.m-toolbar-center{left:50%;transform:translateX(-50%)}.m-toolbar>button{margin:0 4px;padding:2px 0;line-height:1em;vertical-align:middle;border:none;background:transparent}.m-toolbar>button:hover{cursor:pointer}.m-toolbar img,.m-toolbar span{vertical-align:middle}.m-toolbar img:hover,.m-toolbar span:hover{cursor:pointer}.m-toolbar span{padding-left:2px}.m-tooltip>[data-tooltip]{position:relative}.m-tooltip>[data-tooltip]::before,.m-tooltip>[data-tooltip]::after{position:absolute;top:100%;left:50%;z-index:99;transition:0.2s;opacity:0}.m-tooltip>[data-tooltip]:hover::before,.m-tooltip>[data-tooltip]:hover::after{opacity:1}.m-tooltip>[data-tooltip]::before{content:\"\";transform:translatex(-50%) rotate(180deg);margin-top:5px;border-width:4px 6px 0 6px;border-style:solid;border-color:transparent;border-top-color:rgba(70, 76, 91, 0.9)}.m-tooltip>[data-tooltip]::after{content:attr(data-tooltip);transform:translatex(-50%);width:max-content;padding:6px 10px;margin-top:9px;border-radius:5px;text-align:center;color:#fff;background:rgba(70, 76, 91, 0.9);pointer-events:none}";
 
@@ -25,4 +25,32 @@ const MapToolbar$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     };
+    /**
+     * 工具栏操作项事件委托绑定
+     */
+    this.handleToolbar = ({ target }) => {
+      const { type: actionType, id } = target.dataset;
+      const { mapInstance, overlayOptions, context: { mouseTool, rangingTool } } = this;
+      this.context.actionId = id;
+      this.clearPaintAndCloseMouseTool();
+      if (['marker', 'measureArea', 'distanceMeasurement'].includes(actionType)) {
+        mapInstance.setDefaultCursor('pointer');
+      }
+      else {
+        mapInstance.setDefaultCursor('crosshair');
+      }
+      switch (actionType) {
+        case 'marker':
+          mouseTool[actionType]({ content: '<span></span>' }); // 传入空HTML字符串，覆盖icon属性
+          break;
+        case 'distanceMeasurement':
+          rangingTool.setOptions();
+          rangingTool.turnOn();
+          break;
+        default:
+          mouseTool[actionType](overlayOptions);
+      }
+    };
     this.gis = undefined;
     this.mapInstance = undefined;
+    this.visible = false;
+    this.offset = 15;
     this.operations = [];
@@ -112,28 +140,2 @@ this.placement = 'right';
   /**
-   * 工具栏操作项事件委托绑定
-   */
-  handleToolbar({ target }) {
-    const { type: actionType, id } = target.dataset;
-    const { mapInstance, overlayOptions, context: { mouseTool, rangingTool } } = this;
-    this.context.actionId = id;
-    this.clearPaintAndCloseMouseTool();
-    if (['marker', 'measureArea', 'distanceMeasurement'].includes(actionType)) {
-      mapInstance.setDefaultCursor('pointer');
-    }
-    else {
-      mapInstance.setDefaultCursor('crosshair');
-    }
-    switch (actionType) {
-      case 'marker':
-        mouseTool[actionType]({ content: '<span></span>' }); // 传入空HTML字符串，覆盖icon属性
-        break;
-      case 'distanceMeasurement':
-        rangingTool.setOptions();
-        rangingTool.turnOn();
-        break;
-      default:
-        mouseTool[actionType](overlayOptions);
-    }
-  }
-  /**
    * 清除鼠标工具绘制的覆盖物对象并关闭当前鼠标操作
@@ -207,10 +209,12 @@ */
     const dynamicStyle = `m-toolbar ${'m-toolbar-' + this.placement} ${this.mode === 'tooltip' ? 'm-tooltip' : ''}`;
-    return (h("div", { class: dynamicStyle, onClick: ev => this.handleToolbar(ev) }, this.operations.map(({ id, type, name, customEvent, icon }) => {
-      if (customEvent) {
-        return (h("button", { type: "button", "data-tooltip": name, onClick: ev => this[customEvent](ev) }, h("img", { src: icon, width: 20, height: 20 }), this.mode === 'tile' && h("span", null, name)));
-      }
-      else {
-        return (h("button", { type: "button", "data-tooltip": name }, h("img", { "data-id": id, "data-type": type, src: icon, width: 20, height: 20 }), this.mode === 'tile' && h("span", { "data-id": id, "data-type": type }, name)));
-      }
-    })));
+    if (this.visible) {
+      return (h("div", { class: dynamicStyle, onClick: this.handleToolbar, style: { top: this.offset + 'px' } }, this.operations.map(({ id, type, name, customEvent, icon }) => {
+        if (customEvent) {
+          return (h("button", { type: "button", "data-tooltip": name, onClick: ev => this[customEvent](ev) }, h("img", { src: icon, width: 20, height: 20 }), this.mode === 'tile' && h("span", null, name)));
+        }
+        else {
+          return (h("button", { type: "button", "data-tooltip": name }, h("img", { "data-id": id, "data-type": type, src: icon, width: 20, height: 20 }), this.mode === 'tile' && h("span", { "data-id": id, "data-type": type }, name)));
+        }
+      })));
+    }
   }
@@ -221,2 +225,4 @@ static get style() { return mapToolbarCss; }
     "mapInstance": [8, "map-instance"],
+    "visible": [4],
+    "offset": [8],
     "operations": [16],
@@ -223,0 +229,0 @@ "placement": [1],

dist/esm/gis-ui.js

@@ -1,3 +0,3 @@
-import { p as promiseResolve, b as bootstrapLazy } from './index-c646dd10.js';
-export { s as setNonce } from './index-c646dd10.js';
+import { p as promiseResolve, b as bootstrapLazy } from './index-e304c267.js';
+export { s as setNonce } from './index-e304c267.js';
 
@@ -20,5 +20,5 @@ /*
 patchBrowser().then(options => {
-  return bootstrapLazy([["map-district_2",[[1,"map-district",{"visible":[4],"source":[16],"nameAlias":[1,"name-alias"],"codeAlias":[1,"code-alias"],"childrenAlias":[1,"children-alias"],"districtType":[32],"keyword":[32],"list":[32],"districtSelected":[32]}],[1,"map-toolbar",{"gis":[8],"mapInstance":[8,"map-instance"],"operations":[16],"placement":[1],"mode":[1],"actions":[16],"isClear":[4,"is-clear"],"markerIconOptions":[16],"overlayOptions":[16],"infoWindowContent":[16]}]]],["map-isochron",[[2,"map-isochron",{"name":[1],"layerList":[16],"nameAlias":[1,"name-alias"],"travel":[32],"time":[32],"dilute":[32],"layerId":[32],"allTripType":[32]}]]],["map-legend",[[0,"map-legend",{"visible":[4],"dataMap":[16],"left":[2],"bottom":[2]}]]],["map-toolbar-edit-panel",[[1,"map-toolbar-edit-panel",{"visible":[4],"actionType":[1,"action-type"],"name":[32],"description":[32]}]]]], options);
+  return bootstrapLazy([["map-district_2",[[1,"map-district",{"visible":[4],"source":[16],"nameAlias":[1,"name-alias"],"codeAlias":[1,"code-alias"],"childrenAlias":[1,"children-alias"],"districtType":[32],"keyword":[32],"list":[32],"districtSelected":[32]}],[1,"map-toolbar",{"gis":[8],"mapInstance":[8,"map-instance"],"visible":[4],"offset":[8],"operations":[16],"placement":[1],"mode":[1],"actions":[16],"isClear":[4,"is-clear"],"markerIconOptions":[16],"overlayOptions":[16],"infoWindowContent":[16]}]]],["map-isochron",[[6,"map-isochron",{"name":[1]}]]],["map-legend",[[0,"map-legend",{"visible":[4],"dataMap":[16],"left":[2],"bottom":[2]}]]],["map-toolbar-edit-panel",[[1,"map-toolbar-edit-panel",{"visible":[4],"actionType":[1,"action-type"],"name":[32],"description":[32]}]]]], options);
 });
 
 //# sourceMappingURL=gis-ui.js.map

dist/esm/loader.js

@@ -1,3 +0,3 @@
-import { p as promiseResolve, b as bootstrapLazy } from './index-c646dd10.js';
-export { s as setNonce } from './index-c646dd10.js';
+import { p as promiseResolve, b as bootstrapLazy } from './index-e304c267.js';
+export { s as setNonce } from './index-e304c267.js';
 
@@ -14,3 +14,3 @@ /*
   return patchEsm().then(() => {
-  return bootstrapLazy([["map-district_2",[[1,"map-district",{"visible":[4],"source":[16],"nameAlias":[1,"name-alias"],"codeAlias":[1,"code-alias"],"childrenAlias":[1,"children-alias"],"districtType":[32],"keyword":[32],"list":[32],"districtSelected":[32]}],[1,"map-toolbar",{"gis":[8],"mapInstance":[8,"map-instance"],"operations":[16],"placement":[1],"mode":[1],"actions":[16],"isClear":[4,"is-clear"],"markerIconOptions":[16],"overlayOptions":[16],"infoWindowContent":[16]}]]],["map-isochron",[[2,"map-isochron",{"name":[1],"layerList":[16],"nameAlias":[1,"name-alias"],"travel":[32],"time":[32],"dilute":[32],"layerId":[32],"allTripType":[32]}]]],["map-legend",[[0,"map-legend",{"visible":[4],"dataMap":[16],"left":[2],"bottom":[2]}]]],["map-toolbar-edit-panel",[[1,"map-toolbar-edit-panel",{"visible":[4],"actionType":[1,"action-type"],"name":[32],"description":[32]}]]]], options);
+  return bootstrapLazy([["map-district_2",[[1,"map-district",{"visible":[4],"source":[16],"nameAlias":[1,"name-alias"],"codeAlias":[1,"code-alias"],"childrenAlias":[1,"children-alias"],"districtType":[32],"keyword":[32],"list":[32],"districtSelected":[32]}],[1,"map-toolbar",{"gis":[8],"mapInstance":[8,"map-instance"],"visible":[4],"offset":[8],"operations":[16],"placement":[1],"mode":[1],"actions":[16],"isClear":[4,"is-clear"],"markerIconOptions":[16],"overlayOptions":[16],"infoWindowContent":[16]}]]],["map-isochron",[[6,"map-isochron",{"name":[1]}]]],["map-legend",[[0,"map-legend",{"visible":[4],"dataMap":[16],"left":[2],"bottom":[2]}]]],["map-toolbar-edit-panel",[[1,"map-toolbar-edit-panel",{"visible":[4],"actionType":[1,"action-type"],"name":[32],"description":[32]}]]]], options);
   });
@@ -17,0 +17,0 @@ };

dist/esm/map-district_2.entry.js

@@ -1,2 +0,2 @@
-import { r as registerInstance, c as createEvent, h } from './index-c646dd10.js';
+import { r as registerInstance, c as createEvent, h } from './index-e304c267.js';
 
@@ -127,3 +127,3 @@ const mapDistrictCss = "@charset \"UTF-8\";.dialog{width:520px;background-color:#fff;position:fixed;left:50%;top:50%;transform:translate(-50%, -85%);z-index:40;border-radius:4px;transition:0.15s ease}.dialog-mask{position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;background-color:rgba(55, 55, 55, 0.6)}.dialog-header{position:relative;display:flex;align-items:center;justify-content:space-between;margin:0px;padding:10px 15px;box-shadow:0px 2px 4px 0px rgba(221, 221, 221, 0.5)}.dialog-close{position:absolute;right:15px;font-size:24px;color:#999;transition:color 0.2s ease}.dialog-close:hover{color:#666;cursor:pointer}.dialog-header>h3{margin-top:0;margin-bottom:0;font-size:14px;font-weight:normal;color:#2c3e50}.dialog-body{display:flex;padding-left:15px;padding-right:15px;background-color:#fafafb}.dialog-content{display:flex}.dialog-left-content{flex:1;padding-top:10px;font-size:14px;font-weight:normal;color:#515a6e;border-right:1px solid #ccc}.dialog-left-content input{float:right;margin-right:18px}.dialog-body .dialog-left-content>ul{margin-top:8px;margin-bottom:8px;padding-left:4px;height:210px;overflow-y:auto}.dialog-left-content li{position:relative}.dialog-right-content{flex:1;margin-top:13px;margin-bottom:8px;padding-left:12px}.dialog-right-content>h4{margin:0}.dialog-right-content>ul{margin-top:12px;font-size:14px;color:#333333;font-weight:normal}.dialog-right-content li{display:flex;align-items:center;justify-content:space-between}.dialog-right-content .dialog-toolbar{justify-content:space-between}.dialog-footer{padding:7px 15px;text-align:right;box-shadow:0px -2px 4px 0px rgba(216, 216, 216, 0.5)}.dialog-toolbar{display:flex;align-items:center}.dialog-toolbar>h4{margin-top:0;margin-bottom:0;color:#333;font-size:14px;font-weight:normal}.dialog-toolbar>select,.dialog-toolbar>input{height:28px;color:#555;border:none;background:#ececec;border-radius:4px}.dialog-toolbar>select{padding-left:6px;padding-right:6px}.dialog-toolbar>input{margin-left:10px;padding-left:10px;padding-right:10px;outline:none}.dialog-toolbar>select:focus-visible,.dialog-toolbar>input:focus{outline:0}.primary{margin-right:15px;color:#fff;background-color:#2d8cf0;border:1px solid #2d8cf0}.side{color:#515a6e;background-color:#fff;border:1px solid #d7dde4}.primary,.side{padding:4px 15px;border-radius:4px;font-size:14px;transition:0.2s linear}.primary:hover{background-color:#57a3f3;border-color:#57a3f3}.side:hover{color:#57a3f3;background-color:#fff;border-color:#57a3f3}.primary:hover,.side:hover{cursor:pointer}.clear{margin-right:0;border:0;padding:2px 8px;border-radius:40px;font-size:12px}.close{width:14px;height:14px;line-height:12px;border-radius:50%;background-color:#ccc;text-align:center;color:#fff;transition:all 0.15s}.close:hover{background-color:#2d8cf0;cursor:pointer}.triangle::before{content:\"\";display:inline-block;vertical-align:middle;margin-top:2px;margin-right:2px;width:4px;height:4px;border:solid #515a6e;border-width:1px 0 0 1px;transform:translate(-50%, -50%) rotate(135deg);transition:all 0.2s ease-in-out}.open::before{transform:translate(-50%, -50%) rotate(225deg)}.triangle:hover{cursor:pointer}.triangle~ul{transition:all 0.2s ease-in-out;opacity:0;visibility:hidden;height:0;overflow:hidden}.open~ul{height:auto;opacity:1;visibility:visible;overflow:inherit}.fade-in{opacity:1;visibility:visible}.fade-out{opacity:0;visibility:hidden}ul:not(:first-child){padding-left:22px;list-style:none}input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none;margin:0;position:relative;height:14px;width:14px;border-radius:50%;content:\"×\";background-color:#c2c0c0}input[type=search]::-webkit-search-cancel-button:hover{cursor:pointer}";
 
-const mapToolbarCss = ".m-toolbar{position:absolute;z-index:20;padding:2px 6px;width:max-content;background:#fff;box-shadow:0px 1px 4px 0px rgba(0, 0, 0, 0.23);border-radius:4px}.m-toolbar-left{top:15px;left:20px}.m-toolbar-right{top:15px;right:20px}.m-toolbar-center{top:15px;left:50%;transform:translateX(-50%)}.m-toolbar>button{margin:0 4px;padding:2px 0;line-height:1em;vertical-align:middle;border:none;background:transparent}.m-toolbar>button:hover{cursor:pointer}.m-toolbar img,.m-toolbar span{vertical-align:middle}.m-toolbar span{padding-left:2px}.m-tooltip>[data-tooltip]{position:relative}.m-tooltip>[data-tooltip]::before,.m-tooltip>[data-tooltip]::after{position:absolute;top:100%;left:50%;z-index:99;transition:0.2s;opacity:0}.m-tooltip>[data-tooltip]:hover::before,.m-tooltip>[data-tooltip]:hover::after{opacity:1}.m-tooltip>[data-tooltip]::before{content:\"\";transform:translatex(-50%) rotate(180deg);margin-top:5px;border-width:4px 6px 0 6px;border-style:solid;border-color:transparent;border-top-color:rgba(70, 76, 91, 0.9)}.m-tooltip>[data-tooltip]::after{content:attr(data-tooltip);transform:translatex(-50%);width:max-content;padding:6px 10px;margin-top:9px;border-radius:5px;text-align:center;color:#fff;background:rgba(70, 76, 91, 0.9);pointer-events:none}";
+const mapToolbarCss = ".m-toolbar{position:absolute;z-index:20;padding:2px 6px;width:max-content;background:#fff;box-shadow:0px 1px 4px 0px rgba(0, 0, 0, 0.23);border-radius:4px}.m-toolbar-left{left:20px}.m-toolbar-right{right:20px}.m-toolbar-center{left:50%;transform:translateX(-50%)}.m-toolbar>button{margin:0 4px;padding:2px 0;line-height:1em;vertical-align:middle;border:none;background:transparent}.m-toolbar>button:hover{cursor:pointer}.m-toolbar img,.m-toolbar span{vertical-align:middle}.m-toolbar img:hover,.m-toolbar span:hover{cursor:pointer}.m-toolbar span{padding-left:2px}.m-tooltip>[data-tooltip]{position:relative}.m-tooltip>[data-tooltip]::before,.m-tooltip>[data-tooltip]::after{position:absolute;top:100%;left:50%;z-index:99;transition:0.2s;opacity:0}.m-tooltip>[data-tooltip]:hover::before,.m-tooltip>[data-tooltip]:hover::after{opacity:1}.m-tooltip>[data-tooltip]::before{content:\"\";transform:translatex(-50%) rotate(180deg);margin-top:5px;border-width:4px 6px 0 6px;border-style:solid;border-color:transparent;border-top-color:rgba(70, 76, 91, 0.9)}.m-tooltip>[data-tooltip]::after{content:attr(data-tooltip);transform:translatex(-50%);width:max-content;padding:6px 10px;margin-top:9px;border-radius:5px;text-align:center;color:#fff;background:rgba(70, 76, 91, 0.9);pointer-events:none}";
 
@@ -148,4 +148,32 @@ const MapToolbar = class {
     };
+    /**
+     * 工具栏操作项事件委托绑定
+     */
+    this.handleToolbar = ({ target }) => {
+      const { type: actionType, id } = target.dataset;
+      const { mapInstance, overlayOptions, context: { mouseTool, rangingTool } } = this;
+      this.context.actionId = id;
+      this.clearPaintAndCloseMouseTool();
+      if (['marker', 'measureArea', 'distanceMeasurement'].includes(actionType)) {
+        mapInstance.setDefaultCursor('pointer');
+      }
+      else {
+        mapInstance.setDefaultCursor('crosshair');
+      }
+      switch (actionType) {
+        case 'marker':
+          mouseTool[actionType]({ content: '<span></span>' }); // 传入空HTML字符串，覆盖icon属性
+          break;
+        case 'distanceMeasurement':
+          rangingTool.setOptions();
+          rangingTool.turnOn();
+          break;
+        default:
+          mouseTool[actionType](overlayOptions);
+      }
+    };
     this.gis = undefined;
     this.mapInstance = undefined;
+    this.visible = false;
+    this.offset = 15;
     this.operations = [];
@@ -235,28 +263,2 @@ this.placement = 'right';
   /**
-   * 工具栏操作项事件委托绑定
-   */
-  handleToolbar({ target }) {
-    const { type: actionType, id } = target.dataset;
-    const { mapInstance, overlayOptions, context: { mouseTool, rangingTool } } = this;
-    this.context.actionId = id;
-    this.clearPaintAndCloseMouseTool();
-    if (['marker', 'measureArea', 'distanceMeasurement'].includes(actionType)) {
-      mapInstance.setDefaultCursor('pointer');
-    }
-    else {
-      mapInstance.setDefaultCursor('crosshair');
-    }
-    switch (actionType) {
-      case 'marker':
-        mouseTool[actionType]({ content: '<span></span>' }); // 传入空HTML字符串，覆盖icon属性
-        break;
-      case 'distanceMeasurement':
-        rangingTool.setOptions();
-        rangingTool.turnOn();
-        break;
-      default:
-        mouseTool[actionType](overlayOptions);
-    }
-  }
-  /**
    * 清除鼠标工具绘制的覆盖物对象并关闭当前鼠标操作
@@ -330,10 +332,12 @@ */
     const dynamicStyle = `m-toolbar ${'m-toolbar-' + this.placement} ${this.mode === 'tooltip' ? 'm-tooltip' : ''}`;
-    return (h("div", { class: dynamicStyle, onClick: ev => this.handleToolbar(ev) }, this.operations.map(({ id, type, name, customEvent, icon }) => {
-      if (customEvent) {
-        return (h("button", { type: "button", "data-tooltip": name, onClick: ev => this[customEvent](ev) }, h("img", { src: icon, width: 20, height: 20 }), this.mode === 'tile' && h("span", null, name)));
-      }
-      else {
-        return (h("button", { type: "button", "data-tooltip": name }, h("img", { "data-id": id, "data-type": type, src: icon, width: 20, height: 20 }), this.mode === 'tile' && h("span", { "data-id": id, "data-type": type }, name)));
-      }
-    })));
+    if (this.visible) {
+      return (h("div", { class: dynamicStyle, onClick: this.handleToolbar, style: { top: this.offset + 'px' } }, this.operations.map(({ id, type, name, customEvent, icon }) => {
+        if (customEvent) {
+          return (h("button", { type: "button", "data-tooltip": name, onClick: ev => this[customEvent](ev) }, h("img", { src: icon, width: 20, height: 20 }), this.mode === 'tile' && h("span", null, name)));
+        }
+        else {
+          return (h("button", { type: "button", "data-tooltip": name }, h("img", { "data-id": id, "data-type": type, src: icon, width: 20, height: 20 }), this.mode === 'tile' && h("span", { "data-id": id, "data-type": type }, name)));
+        }
+      })));
+    }
   }
@@ -340,0 +344,0 @@ };

dist/esm/map-isochron.entry.js

@@ -1,4 +0,4 @@
-import { r as registerInstance, c as createEvent, h } from './index-c646dd10.js';
+import { r as registerInstance, c as createEvent, h } from './index-e304c267.js';
 
-const mapIsochronCss = "*.sc-map-isochron{padding:0;margin:0}.chron-page.sc-map-isochron{width:336px;background:#fff;font-size:14px;color:#333333;position:relative;border-radius:4px;box-shadow:0 1px 2px rgba(0, 0, 0, 0.1)}.page-title.sc-map-isochron{text-align:center;padding-top:10px}.form.sc-map-isochron{padding:15px}.form.sc-map-isochron>label.sc-map-isochron{display:block;font-size:14px;color:#333333;font-weight:normal;margin-bottom:12px}.form.sc-map-isochron>label.sc-map-isochron span.sc-map-isochron{width:100px;display:inline-block}.form.sc-map-isochron>label.sc-map-isochron .rate-num.sc-map-isochron{display:inline-block;margin-left:6px;width:20px}.form.sc-map-isochron input[type=text].sc-map-isochron,.form.sc-map-isochron input[type=number].sc-map-isochron{width:180px;display:inline-block;padding:6px 8px;border:1px solid #dcdee2;border-radius:4px;transition:0.2s linear;box-sizing:border-box;color:#555}.form.sc-map-isochron input[type=text].sc-map-isochron:focus,.form.sc-map-isochron input[type=text].sc-map-isochron:hover,.form.sc-map-isochron input[type=number].sc-map-isochron:focus,.form.sc-map-isochron input[type=number].sc-map-isochron:hover{outline:0;border-color:#57a3f3;box-shadow:0 0 0 0.010417rem rgba(45, 140, 240, 0.2)}.form.sc-map-isochron input[type=number].sc-map-isochron{height:28px}.form.sc-map-isochron input[type=range].sc-map-isochron{width:180px;vertical-align:middle;margin-top:-3px}.form.sc-map-isochron select.sc-map-isochron{width:180px;padding:0 8px}.page-footer.sc-map-isochron{padding:0 15px 20px;text-align:center;border-bottom-left-radius:4px;border-bottom-right-radius:4px}.primary.sc-map-isochron{margin-right:15px;color:#fff;background-color:#2d8cf0;border:1px solid #2d8cf0}.side.sc-map-isochron{color:#515a6e;background-color:#fff;border:1px solid #d7dde4}.primary.sc-map-isochron,.side.sc-map-isochron{padding:4px 15px;border-radius:4px;font-size:14px;transition:0.2s linear}.primary.sc-map-isochron:hover{background-color:#57a3f3;border-color:#57a3f3}.side.sc-map-isochron:hover{color:#57a3f3;background-color:#fff;border-color:#57a3f3}.primary.sc-map-isochron:hover,.side.sc-map-isochron:hover{cursor:pointer}.info-sharp.sc-map-isochron{position:absolute;margin-left:-8px;border-left:8px solid transparent;border-right:8px solid transparent;left:50%;border-top:8px solid #fff}.info-sharp.sc-map-isochron::after{box-sizing:border-box;margin-left:-8px;border-left:8px solid transparent;border-right:8px solid transparent;position:absolute;content:\"\";margin-top:-7px;border-top:8px solid rgba(0, 0, 0, 0.3);filter:blur(2px);z-index:-1}";
+const mapIsochronCss = "*.sc-map-isochron{padding:0;margin:0}.chron-page.sc-map-isochron{width:336px;background:#fff;font-size:14px;color:#333333;position:relative;border-radius:4px;box-shadow:0 1px 2px rgba(0, 0, 0, 0.1)}.page-title.sc-map-isochron{text-align:center;padding-top:10px}.form.sc-map-isochron{padding:15px}.form.sc-map-isochron>label.sc-map-isochron{display:block;font-size:14px;color:#333333;font-weight:normal;margin-bottom:12px}.form.sc-map-isochron>label.sc-map-isochron span.sc-map-isochron{width:100px;display:inline-block}.form.sc-map-isochron>label.sc-map-isochron .name.sc-map-isochron{display:inline-block;width:180px;vertical-align:middle;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.form.sc-map-isochron>label.sc-map-isochron .rate-num.sc-map-isochron{display:inline-block;margin-left:6px;width:20px}.form.sc-map-isochron input[type=text].sc-map-isochron,.form.sc-map-isochron input[type=number].sc-map-isochron{width:180px;display:inline-block;padding:6px 8px;border:1px solid #dcdee2;border-radius:4px;transition:0.2s linear;box-sizing:border-box;color:#555}.form.sc-map-isochron input[type=text].sc-map-isochron:focus,.form.sc-map-isochron input[type=text].sc-map-isochron:hover,.form.sc-map-isochron input[type=number].sc-map-isochron:focus,.form.sc-map-isochron input[type=number].sc-map-isochron:hover{outline:0;border-color:#57a3f3;box-shadow:0 0 0 0.010417rem rgba(45, 140, 240, 0.2)}.form.sc-map-isochron input[type=number].sc-map-isochron{height:28px}.form.sc-map-isochron input[type=range].sc-map-isochron{width:180px;vertical-align:middle;margin-top:-3px}.form.sc-map-isochron select.sc-map-isochron{width:180px;padding:0 8px}.form.sc-map-isochron .error.sc-map-isochron{color:#f56c6c;margin-left:100px;font-size:12px;margin-top:4px}.page-footer.sc-map-isochron{padding:0 15px 20px;text-align:center;border-bottom-left-radius:4px;border-bottom-right-radius:4px}.primary.sc-map-isochron{margin-right:15px;color:#fff;background-color:#2d8cf0;border:1px solid #2d8cf0}.side.sc-map-isochron{color:#515a6e;background-color:#fff;border:1px solid #d7dde4}.primary.sc-map-isochron,.side.sc-map-isochron{padding:4px 15px;border-radius:4px;font-size:14px;transition:0.2s linear}.primary.sc-map-isochron:hover{background-color:#57a3f3;border-color:#57a3f3}.side.sc-map-isochron:hover{color:#57a3f3;background-color:#fff;border-color:#57a3f3}.primary.sc-map-isochron:hover,.side.sc-map-isochron:hover{cursor:pointer}.info-sharp.sc-map-isochron{position:absolute;margin-left:-8px;border-left:8px solid transparent;border-right:8px solid transparent;left:50%;border-top:8px solid #fff}.info-sharp.sc-map-isochron::after{box-sizing:border-box;margin-left:-8px;border-left:8px solid transparent;border-right:8px solid transparent;position:absolute;content:\"\";margin-top:-7px;border-top:8px solid rgba(0, 0, 0, 0.3);filter:blur(2px);z-index:-1}";
 
@@ -10,34 +10,8 @@ const MapIsochron = class {
     this.cancel = createEvent(this, "cancel", 7);
-    this.name = undefined;
-    this.layerList = [];
-    this.nameAlias = 'name';
-    this.travel = undefined;
-    this.time = undefined;
-    this.dilute = 50;
-    this.layerId = undefined;
-    this.allTripType = [
-      {
-        id: undefined, name: '请选择交通方式'
-      },
-      {
-        id: 'walking', name: '步行'
-      },
-      {
-        id: 'cycling', name: '骑行'
-      },
-      {
-        id: 'driving', name: '驾车'
-      }
-    ];
+    this.name = '生成等时圈';
   }
-  handelChange(event, field) {
-    this[field] = event.target.value;
-  }
-  chouxiChange(event) {
-    console.log('chouxiChange', event);
-    this.dilute = event.target.value;
-  }
   confirmHandler(event) {
     event.stopPropagation();
-    this.confirm.emit({ name: this.name, travel: this.travel, time: this.time, dilute: this.dilute, layer: this.layerId });
+    this.confirm.emit();
+    // this.confirm.emit({ name: this.name, travel: this.travel, time: this.time, dilute: this.dilute, layer: this.layerId })
   }
@@ -49,8 +23,8 @@ cancelHandler(event) {
   componentWillLoad() {
-    if (this.layerList.filter(item => item.id).length === this.layerList.length) {
-      this.layerList = [{ id: undefined, name: '请选择图层' }].concat(this.layerList);
-    }
+    // if (this.layerList.filter(item => item.id).length === this.layerList.length) {
+    //   this.layerList = [{ id: undefined, name: '请选择图层' }].concat(this.layerList)
+    // }
   }
   render() {
-    return (h("div", { class: "chron-page", id: "isochron" }, h("h3", { class: "page-title" }, "\u751F\u6210\u7B49\u65F6\u5708"), h("div", { class: "page-body" }, h("form", { class: "form" }, h("label", null, h("span", null, "\u4E2D\u5FC3\u70B9\u4F4D\u7F6E\uFF1A"), h("span", null, this.name)), h("label", null, h("span", null, "\u4EA4\u901A\u65B9\u5F0F\uFF1A"), h("select", { onInput: (event) => this.handelChange(event, 'travel') }, this.allTripType.map(type => (h("option", { value: type.id, selected: this.travel === type.id }, type.name))))), h("label", null, h("span", null, "\u901A\u884C\u65F6\u957F\uFF1A"), h("input", { type: "number", onInput: (event) => this.handelChange(event, 'time'), min: "1", max: "60", value: this.time, placeholder: "1-60min" })), h("label", null, h("span", null, "\u62BD\u7A00\u7387\uFF1A"), h("input", { type: "range", min: "0", max: "100", step: "1", value: this.dilute, onChange: (event) => this.chouxiChange(event) }), h("span", { class: "rate-num" }, this.dilute, "%")), h("label", null, h("span", null, "\u4FDD\u5B58\u81F3\u56FE\u5C42\uFF1A"), h("select", { onInput: (event) => this.handelChange(event, 'layerId') }, this.layerList.map(layer => (h("option", { value: layer.id, selected: this.layerId === layer.id }, layer.name))))))), h("div", { class: "page-footer" }, h("button", { type: "button", class: "primary", onClick: (event) => this.confirmHandler(event) }, "\u786E\u5B9A"), h("button", { type: "button", class: "side", onClick: (event) => this.cancelHandler(event) }, "\u53D6\u6D88")), h("div", { class: "info-sharp" })));
+    return (h("div", { class: "chron-page", id: "isochron" }, h("h3", { class: "page-title" }, this.name), h("div", { class: "page-body" }, h("slot", null)), h("div", { class: "page-footer" }, h("button", { type: "button", class: "primary", onClick: (event) => this.confirmHandler(event) }, "\u786E\u5B9A"), h("button", { type: "button", class: "side", onClick: (event) => this.cancelHandler(event) }, "\u53D6\u6D88")), h("div", { class: "info-sharp" })));
   }
@@ -57,0 +31,0 @@ };

dist/esm/map-legend.entry.js

@@ -1,2 +0,2 @@
-import { r as registerInstance, h, H as Host } from './index-c646dd10.js';
+import { r as registerInstance, h, H as Host } from './index-e304c267.js';
 
@@ -3,0 +3,0 @@ const mapLegendCss = ":host{display:block}.legend-box{position:absolute;bottom:40px;left:40px;font-size:12px;color:#333;padding:10px;background:#fff;border-radius:4px}.legend-box>div{line-height:2}.legend-box .legend-icon{display:inline-block;width:30px;height:8px;margin-right:8px}";

dist/esm/map-toolbar-edit-panel.entry.js

@@ -1,2 +0,2 @@
-import { r as registerInstance, c as createEvent, h } from './index-c646dd10.js';
+import { r as registerInstance, c as createEvent, h } from './index-e304c267.js';
 
@@ -3,0 +3,0 @@ const mapToolbarEditPanelCss = ".panel{position:absolute;top:52px;right:20px;bottom:15px;width:328px;background-color:#fff;border:1px solid #ccc;border-radius:4px;box-sizing:border-box;box-shadow:rgba(0, 0, 0, 0.23) 0px 1px 4px 0px;transition:0.15s ease}.panel-title{margin:0;padding:10px 15px;border-bottom:1px solid #ccc;color:#2c3e50;font-size:14px;font-weight:normal}.panel-body{padding:15px;overflow-y:auto;height:calc(100% - 113px)}.panel-footer{position:absolute;right:0;left:0;bottom:0;padding:7px 15px;border-top:1px solid #ccc;text-align:right;background-color:#f5f5f5;border-bottom-left-radius:4px;border-bottom-right-radius:4px}.form>label{display:flex;align-items:center;margin-bottom:12px;font-size:14px;color:#333;font-weight:normal}.form>label>input{flex:1;width:100%;padding:6px 8px;border:1px solid #dcdee2;border-radius:4px;transition:0.2s linear;box-sizing:border-box;color:#555}.form input:focus,.form input:hover{outline:0;border-color:#57a3f3;box-shadow:0 0 0 0.010417rem rgba(45, 140, 240, 0.2)}.primary{margin-right:15px;color:#fff;background-color:#2d8cf0;border:1px solid #2d8cf0}.side{color:#515a6e;background-color:#fff;border:1px solid #d7dde4}.primary,.side{padding:4px 15px;border-radius:4px;font-size:14px;transition:0.2s linear}.primary:hover{background-color:#57a3f3;border-color:#57a3f3}.side:hover{color:#57a3f3;background-color:#fff;border-color:#57a3f3}.primary:hover,.side:hover{cursor:pointer}.fade-in{opacity:1;visibility:visible}.fade-out{opacity:0;visibility:hidden}";

dist/gis-ui/gis-ui.esm.js

@@ -1,2 +0,2 @@
-import{p as a,b as e}from"./p-8bdfa8ab.js";export{s as setNonce}from"./p-8bdfa8ab.js";const i=()=>{const e=import.meta.url;const i={};if(e!==""){i.resourcesUrl=new URL(".",e).href}return a(i)};i().then((a=>e([["p-532bb12f",[[1,"map-district",{visible:[4],source:[16],nameAlias:[1,"name-alias"],codeAlias:[1,"code-alias"],childrenAlias:[1,"children-alias"],districtType:[32],keyword:[32],list:[32],districtSelected:[32]}],[1,"map-toolbar",{gis:[8],mapInstance:[8,"map-instance"],operations:[16],placement:[1],mode:[1],actions:[16],isClear:[4,"is-clear"],markerIconOptions:[16],overlayOptions:[16],infoWindowContent:[16]}]]],["p-7a262e65",[[2,"map-isochron",{name:[1],layerList:[16],nameAlias:[1,"name-alias"],travel:[32],time:[32],dilute:[32],layerId:[32],allTripType:[32]}]]],["p-1010ff64",[[0,"map-legend",{visible:[4],dataMap:[16],left:[2],bottom:[2]}]]],["p-4e9aaeea",[[1,"map-toolbar-edit-panel",{visible:[4],actionType:[1,"action-type"],name:[32],description:[32]}]]]],a)));
+import{p as e,b as i}from"./p-b292496b.js";export{s as setNonce}from"./p-b292496b.js";const a=()=>{const i=import.meta.url;const a={};if(i!==""){a.resourcesUrl=new URL(".",i).href}return e(a)};a().then((e=>i([["p-94754029",[[1,"map-district",{visible:[4],source:[16],nameAlias:[1,"name-alias"],codeAlias:[1,"code-alias"],childrenAlias:[1,"children-alias"],districtType:[32],keyword:[32],list:[32],districtSelected:[32]}],[1,"map-toolbar",{gis:[8],mapInstance:[8,"map-instance"],visible:[4],offset:[8],operations:[16],placement:[1],mode:[1],actions:[16],isClear:[4,"is-clear"],markerIconOptions:[16],overlayOptions:[16],infoWindowContent:[16]}]]],["p-679c7c0e",[[6,"map-isochron",{name:[1]}]]],["p-b61b9535",[[0,"map-legend",{visible:[4],dataMap:[16],left:[2],bottom:[2]}]]],["p-7f864b99",[[1,"map-toolbar-edit-panel",{visible:[4],actionType:[1,"action-type"],name:[32],description:[32]}]]]],e)));
 //# sourceMappingURL=gis-ui.esm.js.map

dist/types/components.d.ts

@@ -33,13 +33,5 @@ /* eslint-disable */
         /**
-          * 图层列表
+          * title
          */
-        "layerList": any[];
-        /**
-          * 中心点位置名称
-         */
         "name": string;
-        /**
-          * 图层name别名
-         */
-        "nameAlias": string;
     }
@@ -56,5 +48,5 @@ interface MapLegend {
          */
-        "actions": string[];
+        "actions"?: string[];
         /**
-          * 地图源对象
+          * 地图基础库源对象
          */
@@ -65,7 +57,7 @@ "gis": any;
          */
-        "infoWindowContent": Element;
+        "infoWindowContent"?: HTMLElement;
         /**
           * 工具栏清空操作的显示状态
          */
-        "isClear": boolean;
+        "isClear"?: boolean;
         /**
@@ -82,7 +74,11 @@ * 地图实例
          */
-        "mode": string;
+        "mode"?: string;
         /**
+          * 组件距离相对容器的顶部偏移量
+         */
+        "offset"?: number | string;
+        /**
           * 工具栏操作项源数据
          */
-        "operations": any[];
+        "operations"?: any[];
         /**
@@ -95,3 +91,7 @@ * 工具栏鼠标绘制区域的风格配置项
          */
-        "placement": string;
+        "placement"?: string;
+        /**
+          * 组件显示状态
+         */
+        "visible"?: boolean;
     }
@@ -197,14 +197,6 @@ interface MapToolbarEditPanel {
         /**
-          * 图层列表
+          * title
          */
-        "layerList"?: any[];
+        "name"?: string;
         /**
-          * 中心点位置名称
-         */
-        "name": string;
-        /**
-          * 图层name别名
-         */
-        "nameAlias"?: string;
-        /**
           * 点击取消时触发的通信事件
@@ -230,3 +222,3 @@ */
         /**
-          * 地图源对象
+          * 地图基础库源对象
          */
@@ -237,3 +229,3 @@ "gis": any;
          */
-        "infoWindowContent"?: Element;
+        "infoWindowContent"?: HTMLElement;
         /**
@@ -256,2 +248,6 @@ * 工具栏清空操作的显示状态
         /**
+          * 组件距离相对容器的顶部偏移量
+         */
+        "offset"?: number | string;
+        /**
           * 鼠标工具绘制覆盖物结束时触发的通信事件
@@ -276,2 +272,6 @@ */
         "placement"?: string;
+        /**
+          * 组件显示状态
+         */
+        "visible"?: boolean;
     }
@@ -278,0 +278,0 @@ interface MapToolbarEditPanel {

dist/types/components/map-isochron/map-isochron.d.ts

@@ -8,20 +8,14 @@ import { EventEmitter } from '../../stencil-public-runtime';
   /**
-   * 中心点位置名称
+   * title
    */
   name: string;
   /**
+   * 中心点位置名称
+   */
+  /**
    * 图层列表
    */
-  layerList: any[];
   /**
    * 图层name别名
    */
-  nameAlias: string;
-  travel: string;
-  time: number;
-  dilute: number;
-  layerId: number;
-  allTripType: any[];
-  handelChange(event: any, field: any): void;
-  chouxiChange(event: any): void;
   /**
@@ -28,0 +22,0 @@ * 点击确定时触发的通信事件

dist/types/components/map-toolbar/map-toolbar.d.ts

 import { EventEmitter } from '../../stencil-public-runtime';
 export declare class MapToolbar {
   /**
-   * 地图源对象
+   * 地图基础库源对象
    */
@@ -12,21 +12,29 @@ gis: any;
   /**
+   * 组件显示状态
+   */
+  visible?: boolean;
+  /**
+   * 组件距离相对容器的顶部偏移量
+   */
+  offset?: number | string;
+  /**
    * 工具栏操作项源数据
    */
-  operations: any[];
+  operations?: any[];
   /**
    * 工具栏显示位置：left、right、center
    */
-  placement: string;
+  placement?: string;
   /**
    * 工具栏视图模式：tile 平铺显示、tooltip 工具提示
    */
-  mode: string;
+  mode?: string;
   /**
    * 工具栏自定义操作配置项
    */
-  actions: string[];
+  actions?: string[];
   /**
    * 工具栏清空操作的显示状态
    */
-  isClear: boolean;
+  isClear?: boolean;
   /**
@@ -43,3 +51,3 @@ * 工具栏 Marker 图标配置项
    */
-  infoWindowContent: Element;
+  infoWindowContent?: HTMLElement;
   /**
@@ -54,3 +62,3 @@ * 点击加载行政区划时触发的通信事件
   drawEnd: EventEmitter;
-  handleDrawEnd(): void;
+  private handleDrawEnd;
   /**
@@ -57,0 +65,0 @@ * 组件内部上下文作用域

package.json

 {
   "name": "m-gis-ui",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "description": "A component library based on Gaode Map API",
@@ -45,4 +45,7 @@ "main": "dist/index.cjs.js",
   "homepage": "https://github.com/ionic-team/stencil-component-starter#readme",
-  "keywords": ["TypeScript", "ECMAScript"],
+  "keywords": [
+    "TypeScript",
+    "ECMAScript"
+  ],
   "author": "guorm, sunml"
 }

readme.md

@@ -41,14 +41,16 @@ #### 地图组件库的使用
 
-  | Property                   | Attribute      | Description                    | Type       | Default     |
-  | -------------------------- | -------------- | ------------------------------ | ---------- | ----------- |
-  | `actions`                  | --             | 工具栏自定义操作配置项                    | `string[]` | `[]`        |
-  | `gis` _(required)_         | `gis`          | 地图源对象 AMap                         | `any`      | `undefined` |
-  | `mapInstance` _(required)_ | `gis-instance` | 地图实例                           | `any`      | `undefined` |
-  | `infoWindowContent`        | --             | 自定义信息窗体内容                      | `Element`  | `undefined` |
-  | `isClear`                  | `is-clear`     | 工具栏清空操作的显示状态                   | `boolean`  | `false`     |
-  | `markerIconOptions`        | --             | 工具栏 Marker 图标配置项               | `{}`       | `{}`        |
-  | `mode`                     | `mode`         | 工具栏视图模式：tile 平铺显示、tooltip 工具提示 | `string`   | `'tooltip'` |
-  | `operations`               | --             | 工具栏操作项源数据                      | `any[]`    | `[]`        |
-  | `overlayOptions`           | --             | 工具栏鼠标绘制区域的风格配置项                | `{}`       | `{}`        |
-  | `placement`                | `placement`    | 工具栏显示位置：left、right、center      | `string`   | `'right'`   |
+  | Property                   | Attribute      | Description                    | Type               | Default     |
+  | -------------------------- | -------------- | ------------------------------ | ------------------ | ----------- |
+  | `actions`                  | --             | 工具栏自定义操作配置项                    | `string[]`         | `[]`        |
+  | `gis` _(required)_         | `gis`          | 地图基础库源对象                       | `any`              | `undefined` |
+  | `infoWindowContent`        | --             | 自定义信息窗体内容                      | `HTMLElement`      | `undefined` |
+  | `isClear`                  | `is-clear`     | 工具栏清空操作的显示状态                   | `boolean`          | `false`     |
+  | `mapInstance` _(required)_ | `map-instance` | 地图实例                           | `any`              | `undefined` |
+  | `markerIconOptions`        | --             | 工具栏 Marker 图标配置项               | `{}`               | `{}`        |
+  | `mode`                     | `mode`         | 工具栏视图模式：tile 平铺显示、tooltip 工具提示 | `string`           | `'tooltip'` |
+  | `offset`                   | `offset`       | 组件距离相对容器的顶部偏移量                 | `number \| string` | `15`        |
+  | `operations`               | --             | 工具栏操作项源数据                      | `any[]`            | `[]`        |
+  | `overlayOptions`           | --             | 工具栏鼠标绘制区域的风格配置项                | `{}`               | `{}`        |
+  | `placement`                | `placement`    | 工具栏显示位置：left、right、center      | `string`           | `'right'`   |
+  | `visible`                  | `visible`      | 组件显示状态                         | `boolean`          | `false`     |
 
@@ -77,2 +79,3 @@ * 组件事件通信
   areaMeasurement | 面积量算
+  isochron | 等时圈
 
@@ -130,5 +133,3 @@ #### 行政区划组件
   | ------------------- | ------------ | ----------- | -------- | ----------- |
-  | `layerList`         | --           | 图层列表        | `any[]`  | `[]`        |
-  | `name` _(required)_ | `name`       | 中心点位置名称     | `string` | `undefined` |
-  | `nameAlias`         | `name-alias` | 图层name别名    | `string` | `'name'`    |
+  | `name`             | `name`      | title       | `string` | `'生成等时圈'`   |
 
@@ -135,0 +136,0 @@ * 组件事件通信

New alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1443566

increased by4.09%

Lines of code

9987

increased by7.31%

Number of lines in readme file

153

increased by0.66%

Worsened metrics

Number of package files

110

decreased by-0.9%

No dependency changes