mapboxgl-tools 2.2.13 → 2.2.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.css +1 -1
- package/dist/ui.es.js +69 -5
- package/dist/ui.umd.js +1 -1
- package/package.json +1 -1
package/dist/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.wbk-contextmenus{pointer-events:auto;box-shadow:0 0 3px 1px #8e8e8e;border-radius:5px}.wbk-contextmenus-item{padding:3px 10px;cursor:pointer;transition:all ease .3s;color:#666;fill:#666}.wbk-contextmenus-item:hover .wbk-contextmenus-submenu{display:block!important}.wbk-contextmenus-item:hover{background:#c9e0e0a8;fill:#1890ff}.wbk-contextmenus-item:hover>.wbk-menu-item{color:#1890ff}.wbk-drop-other-menu .ant-dropdown-menu{box-shadow:0 2px 8px #00000029;transform:translate(calc(100% + 10px)) translateY(-39px)}.aside-content{box-shadow:0 0 4px 1px #8e8e8e}.aside-hidden{transform:scale(0) translateY(-50%) translate(50%);transform-origin:right top}.btn-hidden{transform:scale(0) translate(50%) translateY(-50%);transform-origin:right top;opacity:0}.aside-visible{transform:scale(1) translateY(0) translate(0);opacity:1}.wbiokr-geoserver-modal{background:rgba(0,0,0,0);animation:opactiy-in .3s ease 1 forwards}.wbiokr-geoserver-modal>.wbiokr-geoserver-modal-wrappper{transform:scale(0);animation:scale-in .4s ease 1 forwards;width:700px}@-moz-keyframes opactiy-in{0%{background:rgba(0,0,0,0)}to{background:rgba(0,0,0,.5)}}@-webkit-keyframes opactiy-in{0%{background:rgba(0,0,0,0)}to{background:rgba(0,0,0,.5)}}@-o-keyframes opactiy-in{0%{background:rgba(0,0,0,0)}to{background:rgba(0,0,0,.5)}}@keyframes opactiy-in{0%{background:rgba(0,0,0,0)}to{background:rgba(0,0,0,.5)}}@-moz-keyframes scale-in{0%{transform:scale(0)}to{transform:scale(1)}}@-webkit-keyframes scale-in{0%{transform:scale(0)}to{transform:scale(1)}}@-o-keyframes scale-in{0%{transform:scale(0)}to{transform:scale(1)}}@keyframes scale-in{0%{transform:scale(0)}to{transform:scale(1)}}.wbiokr-com-checkbox.wbiokr-com-checked .wbiokr-com-checkbox-content{margin-bottom:1px}.wbiokr-com-checkbox .wbiokr-com-checkbox-content.w-5.h-5{width:7px;height:7px}[class^=wbiokr],[class^=wbiokr] *{box-sizing:border-box}.wbiokr-ctrl-main{transition:all ease .4s;transform:scale(0);opacity:0;background-color:#fff;box-shadow:0 0 3px 1px #8e8e8e;border-radius:4px;overflow:hidden;padding:0 10px}.wbiokr-ctrl-entry{display:flex!important;align-items:center;justify-content:center}.wbiokr-ctrl-entry path{transition:all ease-in .5s}.wbiokr-ctrl-active .wbiokr-ctrl-main{transform:none;opacity:1}.wbiokr-ctrl-active .wbiokr-ctrl-entry path{fill:#189fff}.wbiokr-ctrl-close{cursor:pointer;background:rgba(241,37,37,.91)!important;color:#fff;font-size:16px}.mapboxgl-ctrl-top-left .wbiokr-ctrl-absolute{position:absolute!important;left:33px;top:0;transform-origin:left top}.mapboxgl-ctrl-bottom-left .wbiokr-ctrl-absolute{position:absolute!important;left:33px;bottom:0;transform-origin:left bottom}.mapboxgl-ctrl-top-right .wbiokr-ctrl-absolute{position:absolute!important;right:33px;top:0;transform-origin:right top}.mapboxgl-ctrl-bottom-right .wbiokr-ctrl-absolute{position:absolute!important;right:33px;bottom:0;transform-origin:right bottom}.wbiokr-control-measureDistance-result,.wbiokr-control-measureArea-result{padding:1px 5px;background:#ffffffe8;border-radius:5px;box-shadow:0 0 4px 1px #999}.wbiokr-control-pick .wbiokr-control-pick-main{min-width:115px;white-space:nowrap}.mapboxgl-wbkrect-control .mapboxgl-wbkrect-control-entry{transition:all ease .3s}.mapboxgl-wbkrect-control .mapboxgl-wbkrect-control-entry.wbk-show path{fill:#189fff}.wbiokr-control-mouseRect-result{padding:1px 5px;background:#ffffffe8;border-radius:5px}.wbiokr-control-positionControl-main textarea{width:100%;border:1px solid #eee}.wbiokr-control-positionControl-main textarea:hover,.wbiokr-control-positionControl-main textarea:focus,.wbiokr-control-positionControl-main textarea:focus-visible{border:1px solid #189fff;outline:none}.wbiokr-control-positionControl-main textarea:focus{box-shadow:0 0 3px #189fff}.wbiokr-control-positionControl-main ul{max-height:200px}.wbiokr-control-positionControl-main ul li:hover .wbiokr-position-loc{color:#189fff}.wbiokr-control-positionControl-main .wbiokr-position-tag{color:#389e0d;height:24px;min-width:30px;background:#e6f7ff;border:1px solid #b7eb8f;border-radius:3px;padding:0 2px}.wbiokr-control-positionControl-main .wbokr-position-selected .wbiokr-position-tag{color:#096dd9;border-color:#91d5ff}.wbiokr-control-positionControl-main .wbokr-position-selected .wbiokr-position-loc{color:#189fff}.wbiokr-control-positionControl-city-panel{position:absolute;background:#fff;border-radius:6px;box-shadow:0 0 3px 1px #8e8e8e;z-index:100;display:flex;flex-direction:column;overflow:hidden;top:0;height:220px}.wbiokr-control-positionControl-city-panel .city-panel-
|
|
1
|
+
.wbk-contextmenus{pointer-events:auto;box-shadow:0 0 3px 1px #8e8e8e;border-radius:5px}.wbk-contextmenus-item{padding:3px 10px;cursor:pointer;transition:all ease .3s;color:#666;fill:#666}.wbk-contextmenus-item:hover .wbk-contextmenus-submenu{display:block!important}.wbk-contextmenus-item:hover{background:#c9e0e0a8;fill:#1890ff}.wbk-contextmenus-item:hover>.wbk-menu-item{color:#1890ff}.wbk-drop-other-menu .ant-dropdown-menu{box-shadow:0 2px 8px #00000029;transform:translate(calc(100% + 10px)) translateY(-39px)}.aside-content{box-shadow:0 0 4px 1px #8e8e8e}.aside-hidden{transform:scale(0) translateY(-50%) translate(50%);transform-origin:right top}.btn-hidden{transform:scale(0) translate(50%) translateY(-50%);transform-origin:right top;opacity:0}.aside-visible{transform:scale(1) translateY(0) translate(0);opacity:1}.wbiokr-geoserver-modal{background:rgba(0,0,0,0);animation:opactiy-in .3s ease 1 forwards}.wbiokr-geoserver-modal>.wbiokr-geoserver-modal-wrappper{transform:scale(0);animation:scale-in .4s ease 1 forwards;width:700px}@-moz-keyframes opactiy-in{0%{background:rgba(0,0,0,0)}to{background:rgba(0,0,0,.5)}}@-webkit-keyframes opactiy-in{0%{background:rgba(0,0,0,0)}to{background:rgba(0,0,0,.5)}}@-o-keyframes opactiy-in{0%{background:rgba(0,0,0,0)}to{background:rgba(0,0,0,.5)}}@keyframes opactiy-in{0%{background:rgba(0,0,0,0)}to{background:rgba(0,0,0,.5)}}@-moz-keyframes scale-in{0%{transform:scale(0)}to{transform:scale(1)}}@-webkit-keyframes scale-in{0%{transform:scale(0)}to{transform:scale(1)}}@-o-keyframes scale-in{0%{transform:scale(0)}to{transform:scale(1)}}@keyframes scale-in{0%{transform:scale(0)}to{transform:scale(1)}}.wbiokr-com-checkbox.wbiokr-com-checked .wbiokr-com-checkbox-content{margin-bottom:1px}.wbiokr-com-checkbox .wbiokr-com-checkbox-content.w-5.h-5{width:7px;height:7px}[class^=wbiokr],[class^=wbiokr] *{box-sizing:border-box}.wbiokr-ctrl-main{transition:all ease .4s;transform:scale(0);opacity:0;background-color:#fff;box-shadow:0 0 3px 1px #8e8e8e;border-radius:4px;overflow:hidden;padding:0 10px}.wbiokr-ctrl-entry{display:flex!important;align-items:center;justify-content:center}.wbiokr-ctrl-entry path{transition:all ease-in .5s}.wbiokr-ctrl-active .wbiokr-ctrl-main{transform:none;opacity:1}.wbiokr-ctrl-active .wbiokr-ctrl-entry path{fill:#189fff}.wbiokr-ctrl-close{cursor:pointer;background:rgba(241,37,37,.91)!important;color:#fff;font-size:16px}.mapboxgl-ctrl-top-left .wbiokr-ctrl-absolute{position:absolute!important;left:33px;top:0;transform-origin:left top}.mapboxgl-ctrl-bottom-left .wbiokr-ctrl-absolute{position:absolute!important;left:33px;bottom:0;transform-origin:left bottom}.mapboxgl-ctrl-top-right .wbiokr-ctrl-absolute{position:absolute!important;right:33px;top:0;transform-origin:right top}.mapboxgl-ctrl-bottom-right .wbiokr-ctrl-absolute{position:absolute!important;right:33px;bottom:0;transform-origin:right bottom}.wbiokr-control-measureDistance-result,.wbiokr-control-measureArea-result{padding:1px 5px;background:#ffffffe8;border-radius:5px;box-shadow:0 0 4px 1px #999}.wbiokr-control-pick .wbiokr-control-pick-main{min-width:115px;white-space:nowrap}.mapboxgl-wbkrect-control .mapboxgl-wbkrect-control-entry{transition:all ease .3s}.mapboxgl-wbkrect-control .mapboxgl-wbkrect-control-entry.wbk-show path{fill:#189fff}.wbiokr-control-mouseRect-result{padding:1px 5px;background:#ffffffe8;border-radius:5px}.wbiokr-control-positionControl-main textarea{width:100%;border:1px solid #eee}.wbiokr-control-positionControl-main textarea:hover,.wbiokr-control-positionControl-main textarea:focus,.wbiokr-control-positionControl-main textarea:focus-visible{border:1px solid #189fff;outline:none}.wbiokr-control-positionControl-main textarea:focus{box-shadow:0 0 3px #189fff}.wbiokr-control-positionControl-main ul{max-height:200px}.wbiokr-control-positionControl-main ul li:hover .wbiokr-position-loc{color:#189fff}.wbiokr-control-positionControl-main .wbiokr-position-tag{color:#389e0d;height:24px;min-width:30px;background:#e6f7ff;border:1px solid #b7eb8f;border-radius:3px;padding:0 2px}.wbiokr-control-positionControl-main .wbokr-position-selected .wbiokr-position-tag{color:#096dd9;border-color:#91d5ff}.wbiokr-control-positionControl-main .wbokr-position-selected .wbiokr-position-loc{color:#189fff}.wbiokr-control-positionControl-city-panel{position:absolute;background:#fff;border-radius:6px;box-shadow:0 0 3px 1px #8e8e8e;z-index:100;display:flex;flex-direction:column;overflow:hidden;top:0;height:220px}.wbiokr-control-positionControl-city-panel .city-panel-header{display:flex;align-items:center;padding:8px 10px;border-bottom:1px solid #eee;background:#fafafa;gap:8px}.wbiokr-control-positionControl-city-panel .city-panel-title{padding:0;font-size:12px;font-weight:600;color:#333;text-align:left;white-space:nowrap;flex-shrink:0}.wbiokr-control-positionControl-city-panel .city-search-input{margin:0;padding:4px 11px;font-size:12px;line-height:1.5;color:#000000d9;background-color:#fff;border:1px solid #d9d9d9;border-radius:4px;transition:all .2s;outline:none;flex:1;min-width:0}.wbiokr-control-positionControl-city-panel .city-search-input:hover{border-color:#40a9ff}.wbiokr-control-positionControl-city-panel .city-search-input:focus{border-color:#40a9ff;box-shadow:0 0 0 2px #1890ff33}.wbiokr-control-positionControl-city-panel .city-search-input::placeholder{color:#bfbfbf}.wbiokr-control-positionControl-city-panel .city-search-input:disabled{background-color:#f5f5f5;cursor:not-allowed;opacity:.6}.wbiokr-control-positionControl-city-panel .city-panel-close{position:static;width:20px;height:20px;display:flex;align-items:center;justify-content:center;font-size:16px;color:#999;cursor:pointer;z-index:10;border-radius:50%;transition:all .2s;flex-shrink:0;margin-left:auto}.wbiokr-control-positionControl-city-panel .city-panel-close:hover{background:#f5f5f5;color:#333}.wbiokr-control-positionControl-city-panel .city-list-container{flex:1;overflow-y:auto;padding:3px 0}.wbiokr-control-positionControl-city-panel .city-list-container::-webkit-scrollbar{width:4px}.wbiokr-control-positionControl-city-panel .city-list-container::-webkit-scrollbar-thumb{background:#ddd;border-radius:2px}.wbiokr-control-positionControl-city-panel .city-list-container::-webkit-scrollbar-thumb:hover{background:#bbb}.wbiokr-control-positionControl-city-panel .province-title{padding:4px 8px;font-size:11px;font-weight:600;color:#333;background:#f5f5f5;border-bottom:1px solid #eee}.wbiokr-control-positionControl-city-panel .province-title.search-highlight{background:#fff1b8;color:#d46b08;font-weight:700;animation:highlight-pulse 1.5s ease-in-out infinite}.wbiokr-control-positionControl-city-panel .cities-wrapper{display:flex;flex-wrap:wrap;padding:3px;gap:3px}.wbiokr-control-positionControl-city-panel .city-item{padding:3px 6px;font-size:11px;color:#666;background:#f9f9f9;border:1px solid #e8e8e8;border-radius:3px;cursor:pointer;transition:all .2s;white-space:nowrap}.wbiokr-control-positionControl-city-panel .city-item:hover{background:#e6f7ff;color:#189fff;border-color:#91d5ff}.wbiokr-control-positionControl-city-panel .city-item.search-highlight{background:#fff1b8;color:#d46b08;font-weight:700;border-color:#ffd666;animation:highlight-pulse 1.5s ease-in-out infinite}@-moz-keyframes highlight-pulse{0%,to{background:#fff1b8;box-shadow:0 0 #ffd96666}50%{background:#ffe7ba;box-shadow:0 0 8px 2px #ffd96699}}@-webkit-keyframes highlight-pulse{0%,to{background:#fff1b8;box-shadow:0 0 #ffd96666}50%{background:#ffe7ba;box-shadow:0 0 8px 2px #ffd96699}}@-o-keyframes highlight-pulse{0%,to{background:#fff1b8;box-shadow:0 0 #ffd96666}50%{background:#ffe7ba;box-shadow:0 0 8px 2px #ffd96699}}@keyframes highlight-pulse{0%,to{background:#fff1b8;box-shadow:0 0 #ffd96666}50%{background:#ffe7ba;box-shadow:0 0 8px 2px #ffd96699}}.wbiokr-control-layersTree-main{background-color:#fffffff2}.wbiokr-control-layersTree-main-ul li{color:#ccc}.wbiokr-control-layersTree-main-ul li.wbiokr-active{color:#333}.wbiokr-control-layersTree-main-ul li:not(.wbiokr-active) svg{fill:#ccc!important}
|
package/dist/ui.es.js
CHANGED
|
@@ -4100,6 +4100,21 @@ class PositionControl extends KeyboardControl {
|
|
|
4100
4100
|
}
|
|
4101
4101
|
const panel = document.createElement("div");
|
|
4102
4102
|
panel.className = `${this.mainClass}-city-panel`;
|
|
4103
|
+
const header = document.createElement("div");
|
|
4104
|
+
header.className = "city-panel-header";
|
|
4105
|
+
panel.appendChild(header);
|
|
4106
|
+
const title = document.createElement("div");
|
|
4107
|
+
title.className = "city-panel-title";
|
|
4108
|
+
title.innerText = "\u9009\u62E9\u57CE\u5E02";
|
|
4109
|
+
header.appendChild(title);
|
|
4110
|
+
const searchInput = document.createElement("input");
|
|
4111
|
+
searchInput.type = "text";
|
|
4112
|
+
searchInput.className = "city-search-input";
|
|
4113
|
+
searchInput.placeholder = "\u641C\u7D22\u57CE\u5E02\u540D\u79F0...";
|
|
4114
|
+
searchInput.oninput = (e2) => {
|
|
4115
|
+
this._filterCities(e2.target.value);
|
|
4116
|
+
};
|
|
4117
|
+
header.appendChild(searchInput);
|
|
4103
4118
|
const closeBtn = document.createElement("div");
|
|
4104
4119
|
closeBtn.className = "city-panel-close";
|
|
4105
4120
|
closeBtn.innerHTML = "\xD7";
|
|
@@ -4107,23 +4122,23 @@ class PositionControl extends KeyboardControl {
|
|
|
4107
4122
|
e2.stopPropagation();
|
|
4108
4123
|
this._closeCityPanel();
|
|
4109
4124
|
};
|
|
4110
|
-
|
|
4111
|
-
const title = document.createElement("div");
|
|
4112
|
-
title.className = "city-panel-title";
|
|
4113
|
-
title.innerText = "\u9009\u62E9\u57CE\u5E02";
|
|
4114
|
-
panel.appendChild(title);
|
|
4125
|
+
header.appendChild(closeBtn);
|
|
4115
4126
|
const listContainer = document.createElement("div");
|
|
4116
4127
|
listContainer.className = "city-list-container";
|
|
4128
|
+
listContainer.setAttribute("id", `${this.mainClass}-city-list-container`);
|
|
4117
4129
|
CHINA_CITY_DATA.forEach((province) => {
|
|
4118
4130
|
const provinceTitle = document.createElement("div");
|
|
4119
4131
|
provinceTitle.className = "province-title";
|
|
4132
|
+
provinceTitle.setAttribute("data-province", province.name);
|
|
4120
4133
|
provinceTitle.innerText = province.name;
|
|
4121
4134
|
listContainer.appendChild(provinceTitle);
|
|
4122
4135
|
const citiesContainer = document.createElement("div");
|
|
4123
4136
|
citiesContainer.className = "cities-wrapper";
|
|
4137
|
+
citiesContainer.setAttribute("data-province", province.name);
|
|
4124
4138
|
province.cities.forEach((city) => {
|
|
4125
4139
|
const cityItem = document.createElement("div");
|
|
4126
4140
|
cityItem.className = "city-item";
|
|
4141
|
+
cityItem.setAttribute("data-city", city.name);
|
|
4127
4142
|
cityItem.innerText = city.name;
|
|
4128
4143
|
cityItem.onclick = (e2) => {
|
|
4129
4144
|
e2.stopPropagation();
|
|
@@ -4234,6 +4249,55 @@ class PositionControl extends KeyboardControl {
|
|
|
4234
4249
|
this.current = 0;
|
|
4235
4250
|
}, 100);
|
|
4236
4251
|
}
|
|
4252
|
+
_filterCities(searchText) {
|
|
4253
|
+
if (!this.cityPanelElement)
|
|
4254
|
+
return;
|
|
4255
|
+
const listContainer = this.cityPanelElement.querySelector(".city-list-container");
|
|
4256
|
+
if (!listContainer)
|
|
4257
|
+
return;
|
|
4258
|
+
const searchLower = searchText.toLowerCase().trim();
|
|
4259
|
+
const provinceTitles = listContainer.querySelectorAll(".province-title");
|
|
4260
|
+
const cityItems = listContainer.querySelectorAll(".city-item");
|
|
4261
|
+
provinceTitles.forEach((title) => {
|
|
4262
|
+
title.classList.remove("search-highlight");
|
|
4263
|
+
});
|
|
4264
|
+
cityItems.forEach((item) => {
|
|
4265
|
+
item.classList.remove("search-highlight");
|
|
4266
|
+
});
|
|
4267
|
+
if (!searchLower) {
|
|
4268
|
+
return;
|
|
4269
|
+
}
|
|
4270
|
+
let firstMatchElement = null;
|
|
4271
|
+
CHINA_CITY_DATA.forEach((province) => {
|
|
4272
|
+
const provinceTitle = listContainer.querySelector(`.province-title[data-province="${province.name}"]`);
|
|
4273
|
+
if (!provinceTitle)
|
|
4274
|
+
return;
|
|
4275
|
+
if (province.name.toLowerCase().includes(searchLower)) {
|
|
4276
|
+
provinceTitle.classList.add("search-highlight");
|
|
4277
|
+
if (!firstMatchElement) {
|
|
4278
|
+
firstMatchElement = provinceTitle;
|
|
4279
|
+
}
|
|
4280
|
+
return;
|
|
4281
|
+
}
|
|
4282
|
+
province.cities.forEach((city) => {
|
|
4283
|
+
const cityItem = listContainer.querySelector(`.city-item[data-city="${city.name}"]`);
|
|
4284
|
+
if (!cityItem)
|
|
4285
|
+
return;
|
|
4286
|
+
if (city.name.toLowerCase().includes(searchLower)) {
|
|
4287
|
+
if (!firstMatchElement) {
|
|
4288
|
+
cityItem.classList.add("search-highlight");
|
|
4289
|
+
firstMatchElement = cityItem;
|
|
4290
|
+
}
|
|
4291
|
+
}
|
|
4292
|
+
});
|
|
4293
|
+
});
|
|
4294
|
+
if (firstMatchElement) {
|
|
4295
|
+
firstMatchElement.scrollIntoView({
|
|
4296
|
+
behavior: "smooth",
|
|
4297
|
+
block: "nearest"
|
|
4298
|
+
});
|
|
4299
|
+
}
|
|
4300
|
+
}
|
|
4237
4301
|
}
|
|
4238
4302
|
var FUNC_ERROR_TEXT = "Expected a function";
|
|
4239
4303
|
var NAN = 0 / 0;
|