mapboxgl-tools 1.2.4 → 1.4.0

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/.eslintcache CHANGED
@@ -1 +1 @@
1
- [{"G:\\fengtu\\admin-ui\\src\\main.js":"1","G:\\fengtu\\admin-ui\\src\\App.vue":"2","G:\\fengtu\\admin-ui\\src\\Helloworld.vue":"3","G:\\fengtu\\mapboxgl-ui\\src\\main.js":"4","G:\\fengtu\\mapboxgl-ui\\src\\App.vue":"5","G:\\fengtu\\mapboxgl-ui\\src\\Helloworld.vue":"6"},{"size":207,"mtime":1705629488877,"results":"7","hashOfConfig":"8"},{"size":418,"mtime":1705629382904,"results":"9","hashOfConfig":"8"},{"size":510,"mtime":1705915018041,"results":"10","hashOfConfig":"8"},{"size":207,"mtime":1705629488877,"results":"11","hashOfConfig":"12"},{"size":418,"mtime":1705629382904,"results":"13","hashOfConfig":"12"},{"size":6428,"mtime":1708932082683,"results":"14","hashOfConfig":"12"},{"filePath":"15","messages":"16","suppressedMessages":"17","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"15ou60z",{"filePath":"18","messages":"19","suppressedMessages":"20","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"21","messages":"22","suppressedMessages":"23","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"24","messages":"25","suppressedMessages":"26","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"1uibmbb",{"filePath":"27","messages":"28","suppressedMessages":"29","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"30","messages":"31","suppressedMessages":"32","errorCount":14,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":14,"fixableWarningCount":0,"source":null},"G:\\fengtu\\admin-ui\\src\\main.js",[],[],"G:\\fengtu\\admin-ui\\src\\App.vue",[],[],"G:\\fengtu\\admin-ui\\src\\Helloworld.vue",[],[],"G:\\fengtu\\mapboxgl-ui\\src\\main.js",[],[],"G:\\fengtu\\mapboxgl-ui\\src\\App.vue",[],[],"G:\\fengtu\\mapboxgl-ui\\src\\Helloworld.vue",["33","34","35","36","37","38","39","40","41","42","43","44","45","46"],[],{"ruleId":"47","severity":2,"message":"48","line":7,"column":29,"nodeType":null,"messageId":"49","endLine":7,"endColumn":59,"fix":"50"},{"ruleId":"47","severity":2,"message":"51","line":14,"column":25,"nodeType":null,"messageId":"52","endLine":14,"endColumn":26,"fix":"53"},{"ruleId":"47","severity":2,"message":"54","line":15,"column":9,"nodeType":null,"messageId":"49","endLine":16,"endColumn":1,"fix":"55"},{"ruleId":"47","severity":2,"message":"56","line":26,"column":1819,"nodeType":null,"messageId":"57","endLine":26,"endColumn":1819,"fix":"58"},{"ruleId":"47","severity":2,"message":"59","line":29,"column":23,"nodeType":null,"messageId":"49","endLine":29,"endColumn":32,"fix":"60"},{"ruleId":"47","severity":2,"message":"56","line":33,"column":876,"nodeType":null,"messageId":"57","endLine":33,"endColumn":876,"fix":"61"},{"ruleId":"47","severity":2,"message":"62","line":36,"column":23,"nodeType":null,"messageId":"49","endLine":36,"endColumn":32,"fix":"63"},{"ruleId":"47","severity":2,"message":"56","line":45,"column":39,"nodeType":null,"messageId":"57","endLine":45,"endColumn":39,"fix":"64"},{"ruleId":"47","severity":2,"message":"56","line":46,"column":14,"nodeType":null,"messageId":"57","endLine":46,"endColumn":14,"fix":"65"},{"ruleId":"47","severity":2,"message":"56","line":47,"column":10,"nodeType":null,"messageId":"57","endLine":47,"endColumn":10,"fix":"66"},{"ruleId":"47","severity":2,"message":"56","line":48,"column":6,"nodeType":null,"messageId":"57","endLine":48,"endColumn":6,"fix":"67"},{"ruleId":"47","severity":2,"message":"68","line":58,"column":37,"nodeType":null,"messageId":"57","endLine":58,"endColumn":37,"fix":"69"},{"ruleId":"47","severity":2,"message":"56","line":69,"column":10,"nodeType":null,"messageId":"57","endLine":69,"endColumn":10,"fix":"70"},{"ruleId":"47","severity":2,"message":"71","line":106,"column":59,"nodeType":null,"messageId":"49","endLine":106,"endColumn":61,"fix":"72"},"prettier/prettier","Replace `'menus'·:top='100'·:left='200'` with `\"menus\"·:top=\"100\"·:left=\"200\"`","replace",{"range":"73","text":"74"},"Delete `,`","delete",{"range":"75","text":"76"},"Replace `·MouseRectControl,·Contextmenu,·GeoserverAside,·MeasureDistanceControl,·MeasureAreaControl,·PickCoordControl,·transformRequest4326·}·from·'../packages'␍⏎` with `␍⏎····MouseRectControl,␍⏎····Contextmenu,␍⏎····GeoserverAside,␍⏎····MeasureDistanceControl,␍⏎····MeasureAreaControl,␍⏎····PickCoordControl,␍⏎····transformRequest4326,␍⏎}·from·'../packages'`",{"range":"77","text":"78"},"Insert `,`","insert",{"range":"79","text":"80"},"Replace `·alert(1)` with `␍⏎············alert(1)␍⏎·······`",{"range":"81","text":"82"},{"range":"83","text":"80"},"Replace `·alert(2)` with `␍⏎············alert(2)␍⏎·······`",{"range":"84","text":"85"},{"range":"86","text":"80"},{"range":"87","text":"80"},{"range":"88","text":"80"},{"range":"89","text":"80"},"Insert `·`",{"range":"90","text":"91"},{"range":"92","text":"80"},"Replace `=>` with `·=>·`",{"range":"93","text":"94"},[359,389],"\"menus\" :top=\"100\" :left=\"200\"",[539,540],"",[574,727],"\r\n MouseRectControl,\r\n Contextmenu,\r\n GeoserverAside,\r\n MeasureDistanceControl,\r\n MeasureAreaControl,\r\n PickCoordControl,\r\n transformRequest4326,\r\n} from '../packages'",[2774,2774],",",[2835,2844],"\r\n alert(1)\r\n ",[3757,3757],[3816,3825],"\r\n alert(2)\r\n ",[4021,4021],[4036,4036],[4047,4047],[4054,4054],[4452,4452]," ",[4828,4828],[6213,6215]," => "]
1
+ [{"G:\\fengtu\\admin-ui\\src\\main.js":"1","G:\\fengtu\\admin-ui\\src\\App.vue":"2","G:\\fengtu\\admin-ui\\src\\Helloworld.vue":"3","G:\\fengtu\\mapboxgl-ui\\src\\main.js":"4","G:\\fengtu\\mapboxgl-ui\\src\\App.vue":"5","G:\\fengtu\\mapboxgl-ui\\src\\Helloworld.vue":"6"},{"size":207,"mtime":1705629488877,"results":"7","hashOfConfig":"8"},{"size":418,"mtime":1705629382904,"results":"9","hashOfConfig":"8"},{"size":510,"mtime":1705915018041,"results":"10","hashOfConfig":"8"},{"size":207,"mtime":1705629488877,"results":"11","hashOfConfig":"12"},{"size":418,"mtime":1705629382904,"results":"13","hashOfConfig":"12"},{"size":6554,"mtime":1709113524578,"results":"14","hashOfConfig":"12"},{"filePath":"15","messages":"16","suppressedMessages":"17","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"15ou60z",{"filePath":"18","messages":"19","suppressedMessages":"20","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"21","messages":"22","suppressedMessages":"23","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"24","messages":"25","suppressedMessages":"26","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"1uibmbb",{"filePath":"27","messages":"28","suppressedMessages":"29","errorCount":0,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"30","messages":"31","suppressedMessages":"32","errorCount":14,"fatalErrorCount":0,"warningCount":0,"fixableErrorCount":14,"fixableWarningCount":0,"source":null},"G:\\fengtu\\admin-ui\\src\\main.js",[],[],"G:\\fengtu\\admin-ui\\src\\App.vue",[],[],"G:\\fengtu\\admin-ui\\src\\Helloworld.vue",[],[],"G:\\fengtu\\mapboxgl-ui\\src\\main.js",[],[],"G:\\fengtu\\mapboxgl-ui\\src\\App.vue",[],[],"G:\\fengtu\\mapboxgl-ui\\src\\Helloworld.vue",["33","34","35","36","37","38","39","40","41","42","43","44","45","46"],[],{"ruleId":"47","severity":2,"message":"48","line":7,"column":29,"nodeType":null,"messageId":"49","endLine":7,"endColumn":59,"fix":"50"},{"ruleId":"47","severity":2,"message":"51","line":14,"column":25,"nodeType":null,"messageId":"52","endLine":14,"endColumn":26,"fix":"53"},{"ruleId":"47","severity":2,"message":"54","line":23,"column":25,"nodeType":null,"messageId":"49","endLine":24,"endColumn":1,"fix":"55"},{"ruleId":"47","severity":2,"message":"56","line":34,"column":1819,"nodeType":null,"messageId":"57","endLine":34,"endColumn":1819,"fix":"58"},{"ruleId":"47","severity":2,"message":"59","line":37,"column":23,"nodeType":null,"messageId":"49","endLine":37,"endColumn":32,"fix":"60"},{"ruleId":"47","severity":2,"message":"56","line":41,"column":876,"nodeType":null,"messageId":"57","endLine":41,"endColumn":876,"fix":"61"},{"ruleId":"47","severity":2,"message":"62","line":44,"column":23,"nodeType":null,"messageId":"49","endLine":44,"endColumn":32,"fix":"63"},{"ruleId":"47","severity":2,"message":"56","line":53,"column":39,"nodeType":null,"messageId":"57","endLine":53,"endColumn":39,"fix":"64"},{"ruleId":"47","severity":2,"message":"56","line":54,"column":14,"nodeType":null,"messageId":"57","endLine":54,"endColumn":14,"fix":"65"},{"ruleId":"47","severity":2,"message":"56","line":55,"column":10,"nodeType":null,"messageId":"57","endLine":55,"endColumn":10,"fix":"66"},{"ruleId":"47","severity":2,"message":"56","line":56,"column":6,"nodeType":null,"messageId":"57","endLine":56,"endColumn":6,"fix":"67"},{"ruleId":"47","severity":2,"message":"68","line":66,"column":37,"nodeType":null,"messageId":"57","endLine":66,"endColumn":37,"fix":"69"},{"ruleId":"47","severity":2,"message":"56","line":77,"column":10,"nodeType":null,"messageId":"57","endLine":77,"endColumn":10,"fix":"70"},{"ruleId":"47","severity":2,"message":"71","line":114,"column":59,"nodeType":null,"messageId":"49","endLine":114,"endColumn":61,"fix":"72"},"prettier/prettier","Replace `'menus'·:top='100'·:left='200'` with `\"menus\"·:top=\"100\"·:left=\"200\"`","replace",{"range":"73","text":"74"},"Delete `,`","delete",{"range":"75","text":"76"},"Replace `·}·from·'../packages'␍⏎` with `,␍⏎}·from·'../packages'`",{"range":"77","text":"78"},"Insert `,`","insert",{"range":"79","text":"80"},"Replace `·alert(1)` with `␍⏎············alert(1)␍⏎·······`",{"range":"81","text":"82"},{"range":"83","text":"80"},"Replace `·alert(2)` with `␍⏎············alert(2)␍⏎·······`",{"range":"84","text":"85"},{"range":"86","text":"80"},{"range":"87","text":"80"},{"range":"88","text":"80"},{"range":"89","text":"80"},"Insert `·`",{"range":"90","text":"91"},{"range":"92","text":"80"},"Replace `=>` with `·=>·`",{"range":"93","text":"94"},[359,389],"\"menus\" :top=\"100\" :left=\"200\"",[539,540],"",[761,784],",\r\n} from '../packages'",[2831,2831],",",[2892,2901],"\r\n alert(1)\r\n ",[3814,3814],[3873,3882],"\r\n alert(2)\r\n ",[4078,4078],[4093,4093],[4104,4104],[4111,4111],[4509,4509]," ",[4885,4885],[6270,6272]," => "]
package/README.md CHANGED
@@ -10,9 +10,10 @@ npm install mapboxgl-tools
10
10
  ## Modules
11
11
  ```js
12
12
  Geoserver
13
+ Contextmenu
13
14
  ```
14
- ### Geoserver
15
- > 自定义栅格瓦片,记忆缓存
15
+ ### 1.Geoserver
16
+ > 自定义栅格瓦片组件(基于vue2.x),记忆缓存
16
17
 
17
18
  | Property | Type | 默认值 | Description |
18
19
  | ----- | ------------- | ------------- | ------------------------ |
@@ -66,4 +67,230 @@ export default {
66
67
  }
67
68
 
68
69
  </script>
69
- ``
70
+ ```
71
+
72
+ ### 2.Contextmenu
73
+ > 右键菜单项目组件,基于vue2.x
74
+
75
+ | Property | Type | 默认值 | Description |
76
+ | ----- | ------------- | ------------- | ------------------------ |
77
+ | menus | Array | [] | 菜单选项{ icons: [], name: '', click: Function, children: null,[] } |
78
+ | left | Number | 0 | 定位left |
79
+ | top | Number | 0 | 定位top |
80
+
81
+ ```js
82
+ <template>
83
+ <div>
84
+ <Contextmenu :menus='menus' :top='100' :left='200' />
85
+ </div>
86
+ </template>
87
+
88
+ <script>
89
+ import { Contextmenu } from 'mapboxgl-tools'
90
+
91
+ export default {
92
+ components: {
93
+ Contextmenu,
94
+ },
95
+ data() {
96
+ return {
97
+ menus: [
98
+ {
99
+ name: '批量平移挪点',
100
+ click: () => { alert(1) },
101
+ },
102
+ {
103
+ icons: [
104
+ 'M934.184927 199.723787 622.457206 511.452531l311.727721 311.703161c14.334473 14.229073 23.069415 33.951253 23.069415 55.743582 0 43.430138-35.178197 78.660524-78.735226 78.660524-21.664416 0-41.361013-8.865925-55.642275-23.069415L511.149121 622.838388 199.420377 934.490384c-14.204513 14.20349-33.901111 23.069415-55.642275 23.069415-43.482327 0-78.737272-35.230386-78.737272-78.660524 0-21.792329 8.864902-41.513486 23.094998-55.743582l311.677579-311.703161L88.135828 199.723787c-14.230096-14.255679-23.094998-33.92567-23.094998-55.642275 0-43.430138 35.254945-78.762855 78.737272-78.762855 21.741163 0 41.437761 8.813736 55.642275 23.069415l311.727721 311.727721L822.876842 88.389096c14.281261-14.255679 33.977859-23.069415 55.642275-23.069415 43.557028 0 78.735226 35.332716 78.735226 78.762855C957.254342 165.798117 948.5194 185.468109 934.184927 199.723787'
105
+ ],
106
+ name: '取消操作',
107
+ click: () => { alert(2) },
108
+ },
109
+ {
110
+ icons: '',
111
+ name: '其他挪点',
112
+ children: [
113
+ {
114
+ icons: '',
115
+ name: '附属挪点',
116
+ click: () => alert(45)
117
+ }
118
+ ]
119
+ }
120
+ ]
121
+
122
+ }
123
+ },
124
+ }
125
+
126
+ </script>
127
+ ```
128
+
129
+
130
+ ### 3.GeoserverAside
131
+ > 继承Geoserver组件,快速弹窗
132
+
133
+ | Property | Type | 默认值 | Description |
134
+ | ----- | ------------- | ------------- | ------------------------ |
135
+ | map | Object | null | mapboxgl实例对象 |
136
+ | itemClass | String | | 单个geoserver展示class |
137
+ | addClass | String | | 添加按钮class |
138
+ | addBtnProps | Object | { type: 'primary', ghost: false, size: 'small', text: '新增图层' } | 添加按钮属性 |
139
+ | left | Number | 0 | 定位left |
140
+ | top | Number | 0 | 定位top |
141
+
142
+ ```js
143
+ <template>
144
+ <div>
145
+ <GeoserverAside v-if="map" :map="map" itemClass="geo-item" addClass="add-btn" />
146
+ </div>
147
+ </template>
148
+
149
+ <script>
150
+ import { GeoserverAside } from 'mapboxgl-tools'
151
+
152
+ export default {
153
+ components: {
154
+ GeoserverAside,
155
+ },
156
+ data() {
157
+ return {
158
+
159
+ }
160
+ },
161
+ }
162
+
163
+ </script>
164
+ ```
165
+
166
+ ### 4.PickCoordControl
167
+ > 拾取坐标mapboxgl控制器
168
+
169
+ | Property | Type | 默认值 | Description |
170
+ | ----- | ------------- | ------------- | ------------------------ |
171
+ | title | String | 拾取坐标 | 入口按钮title |
172
+ | cb | Function | | 复制完成坐标之后的回调 |
173
+
174
+ ```js
175
+ <template>
176
+ <section id="map" style="width: 90%; height: 700px"></section>
177
+ </template>
178
+
179
+ <script>
180
+ import { PickCoordControl, transformRequest4326 } from 'mapboxgl-tools'
181
+
182
+ export default {
183
+ mounted() {
184
+ const map = new mapboxgl.Map({
185
+ container: 'map',
186
+ style: 'mapbox://styles/mapbox/light-v11',
187
+ zoom: 18,
188
+ center: [114.26697720786854,30.63091896813168],
189
+ transformRequest: transformRequest4326,
190
+ })
191
+ map.addControl(new PickCoordControl({ cb: ()=>message.success('复制成功') }), 'top-right')
192
+ }
193
+ }
194
+
195
+ </script>
196
+ ```
197
+
198
+ ### 5.MouseRectControl
199
+ > 拾取坐标mapboxgl控制器
200
+
201
+ | Property | Type | 默认值 | Description |
202
+ | ----- | ------------- | ------------- | ------------------------ |
203
+ | title | String | 框选 | 入口按钮title |
204
+ | onClose | Function | | 关闭控制器的回调 |
205
+ | onOpen | Function | | 打开控制器的回调 |
206
+ | onEnd | Function | | 完成框选的回调 |
207
+ | onMousemove | Function | | 框选拖拽的回调 |
208
+
209
+ ```js
210
+ <template>
211
+ <section id="map" style="width: 90%; height: 700px"></section>
212
+ </template>
213
+
214
+ <script>
215
+ import { MouseRectControl, transformRequest4326 } from 'mapboxgl-tools'
216
+
217
+ export default {
218
+ mounted() {
219
+ const map = new mapboxgl.Map({
220
+ container: 'map',
221
+ style: 'mapbox://styles/mapbox/light-v11',
222
+ zoom: 18,
223
+ center: [114.26697720786854,30.63091896813168],
224
+ transformRequest: transformRequest4326,
225
+ })
226
+ map.addControl(new MouseRectControl({
227
+ onClose: () => alert('close'),
228
+ onOpen: () => alert('open')
229
+ }), 'top-right')
230
+ }
231
+ }
232
+
233
+ </script>
234
+ ```
235
+
236
+ ### 6.MeasureDistanceControl
237
+ > 测量距离mapboxgl控制器
238
+
239
+ | Property | Type | 默认值 | Description |
240
+ | ----- | ------------- | ------------- | ------------------------ |
241
+ | title | String | 测量距离 | 入口按钮title |
242
+
243
+ ```js
244
+ <template>
245
+ <section id="map" style="width: 90%; height: 700px"></section>
246
+ </template>
247
+
248
+ <script>
249
+ import { MeasureDistanceControl, transformRequest4326 } from 'mapboxgl-tools'
250
+
251
+ export default {
252
+ mounted() {
253
+ const map = new mapboxgl.Map({
254
+ container: 'map',
255
+ style: 'mapbox://styles/mapbox/light-v11',
256
+ zoom: 18,
257
+ center: [114.26697720786854,30.63091896813168],
258
+ transformRequest: transformRequest4326,
259
+ })
260
+ map.addControl(new MeasureDistanceControl(), 'top-right')
261
+ }
262
+ }
263
+
264
+ </script>
265
+ ```
266
+
267
+ ### 7.MeasureAreaControl
268
+ > 测量面积mapboxgl控制器
269
+
270
+ | Property | Type | 默认值 | Description |
271
+ | ----- | ------------- | ------------- | ------------------------ |
272
+ | title | String | 测量面积 | 入口按钮title |
273
+
274
+ ```js
275
+ <template>
276
+ <section id="map" style="width: 90%; height: 700px"></section>
277
+ </template>
278
+
279
+ <script>
280
+ import { MeasureAreaControl, transformRequest4326 } from 'mapboxgl-tools'
281
+
282
+ export default {
283
+ mounted() {
284
+ const map = new mapboxgl.Map({
285
+ container: 'map',
286
+ style: 'mapbox://styles/mapbox/light-v11',
287
+ zoom: 18,
288
+ center: [114.26697720786854,30.63091896813168],
289
+ transformRequest: transformRequest4326,
290
+ })
291
+ map.addControl(new MeasureAreaControl(), 'top-right')
292
+ }
293
+ }
294
+
295
+ </script>
296
+ ```