huweili-cesium 1.2.17 → 1.2.19
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/js/hemisphere.js +1 -1
- package/js/measureDistance.js +102 -42
- package/package.json +1 -1
package/js/hemisphere.js
CHANGED
|
@@ -50,7 +50,7 @@ export function hemisphereConfig() {
|
|
|
50
50
|
*/
|
|
51
51
|
const getHemisphereLabelText = (label, radius) => {
|
|
52
52
|
const radiusLabel = formatHemisphereRadiusLabel(radius);
|
|
53
|
-
return radiusLabel ? `${label}
|
|
53
|
+
return radiusLabel ? `${label} ${radiusLabel}` : label;
|
|
54
54
|
}
|
|
55
55
|
|
|
56
56
|
/**
|
package/js/measureDistance.js
CHANGED
|
@@ -26,16 +26,19 @@ export function measureDistance() {
|
|
|
26
26
|
position: new Cesium.CallbackProperty(() => options.getPosition(), false),
|
|
27
27
|
label: {
|
|
28
28
|
text: new Cesium.CallbackProperty(() => options.getText(), false),
|
|
29
|
-
font: options.font || '10px Microsoft YaHei',
|
|
29
|
+
font: options.font || 'bold 10px Microsoft YaHei',
|
|
30
30
|
fillColor: options.fillColor || Cesium.Color.WHITE,
|
|
31
|
+
style: Cesium.LabelStyle.FILL_AND_OUTLINE,
|
|
32
|
+
outlineColor: Cesium.Color.BLACK,
|
|
33
|
+
outlineWidth: 2,
|
|
31
34
|
showBackground: true,
|
|
32
|
-
backgroundColor: Cesium.Color.fromCssColorString(options.backgroundColor || 'rgba(0, 0, 0, 0.
|
|
33
|
-
backgroundPadding: options.backgroundPadding || new Cesium.Cartesian2(
|
|
35
|
+
backgroundColor: Cesium.Color.fromCssColorString(options.backgroundColor || 'rgba(0, 0, 0, 0.7)'),
|
|
36
|
+
backgroundPadding: options.backgroundPadding || new Cesium.Cartesian2(4, 4),
|
|
34
37
|
verticalOrigin: options.verticalOrigin || Cesium.VerticalOrigin.BOTTOM,
|
|
35
38
|
horizontalOrigin: options.horizontalOrigin || Cesium.HorizontalOrigin.LEFT,
|
|
36
|
-
pixelOffset: options.pixelOffset || new Cesium.Cartesian2(
|
|
39
|
+
pixelOffset: options.pixelOffset || new Cesium.Cartesian2(18, -18),
|
|
37
40
|
disableDepthTestDistance: Number.POSITIVE_INFINITY,
|
|
38
|
-
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, options.maxDistance ||
|
|
41
|
+
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, options.maxDistance || 2000000)
|
|
39
42
|
}
|
|
40
43
|
})
|
|
41
44
|
}
|
|
@@ -190,12 +193,13 @@ export function measureDistance() {
|
|
|
190
193
|
id: tempIds.startPoint,
|
|
191
194
|
position: startPosition,
|
|
192
195
|
point: {
|
|
193
|
-
pixelSize:
|
|
196
|
+
pixelSize: 6,
|
|
194
197
|
color,
|
|
195
198
|
outlineColor: Cesium.Color.WHITE,
|
|
196
|
-
outlineWidth:
|
|
199
|
+
outlineWidth: 1.5,
|
|
197
200
|
disableDepthTestDistance: Number.POSITIVE_INFINITY,
|
|
198
|
-
heightReference: Cesium.HeightReference.CLAMP_TO_GROUND
|
|
201
|
+
heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
|
|
202
|
+
scaleByDistance: new Cesium.NearFarScalar(1000, 1.5, 5000000, 0.5)
|
|
199
203
|
}
|
|
200
204
|
})
|
|
201
205
|
}
|
|
@@ -205,9 +209,13 @@ export function measureDistance() {
|
|
|
205
209
|
id: tempIds.line,
|
|
206
210
|
polyline: {
|
|
207
211
|
positions: new Cesium.CallbackProperty(() => getLinePositions(), false),
|
|
208
|
-
width,
|
|
209
|
-
material:
|
|
210
|
-
|
|
212
|
+
width: width + 2,
|
|
213
|
+
material: new Cesium.PolylineGlowMaterialProperty({
|
|
214
|
+
color: color,
|
|
215
|
+
glowPower: 0.25
|
|
216
|
+
}),
|
|
217
|
+
clampToGround,
|
|
218
|
+
antialias: true
|
|
211
219
|
}
|
|
212
220
|
})
|
|
213
221
|
}
|
|
@@ -218,16 +226,20 @@ export function measureDistance() {
|
|
|
218
226
|
position: new Cesium.CallbackProperty(() => getMidPosition(), false),
|
|
219
227
|
label: {
|
|
220
228
|
text: new Cesium.CallbackProperty(() => formatDistance(getCurrentDistance()), false),
|
|
221
|
-
font: '
|
|
229
|
+
font: 'bold 10px Microsoft YaHei',
|
|
222
230
|
fillColor: Cesium.Color.WHITE,
|
|
231
|
+
style: Cesium.LabelStyle.FILL_AND_OUTLINE,
|
|
232
|
+
outlineColor: Cesium.Color.BLACK,
|
|
233
|
+
outlineWidth: 2,
|
|
223
234
|
showBackground: true,
|
|
224
|
-
backgroundColor: Cesium.Color.fromCssColorString('rgba(0, 0, 0, 0.
|
|
225
|
-
backgroundPadding: new Cesium.Cartesian2(
|
|
235
|
+
backgroundColor: Cesium.Color.fromCssColorString('rgba(0, 0, 0, 0.75)'),
|
|
236
|
+
backgroundPadding: new Cesium.Cartesian2(4, 4),
|
|
226
237
|
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
|
|
227
238
|
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
|
|
228
|
-
pixelOffset: new Cesium.Cartesian2(0, -
|
|
239
|
+
pixelOffset: new Cesium.Cartesian2(0, -16),
|
|
229
240
|
disableDepthTestDistance: Number.POSITIVE_INFINITY,
|
|
230
|
-
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0,
|
|
241
|
+
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 2000000),
|
|
242
|
+
scaleByDistance: new Cesium.NearFarScalar(1000, 1.2, 5000000, 0.6)
|
|
231
243
|
}
|
|
232
244
|
})
|
|
233
245
|
}
|
|
@@ -239,41 +251,80 @@ export function measureDistance() {
|
|
|
239
251
|
id: tempIds.endPoint,
|
|
240
252
|
position: endPosition,
|
|
241
253
|
point: {
|
|
242
|
-
pixelSize:
|
|
254
|
+
pixelSize: 6,
|
|
243
255
|
color,
|
|
244
256
|
outlineColor: Cesium.Color.WHITE,
|
|
245
|
-
outlineWidth:
|
|
257
|
+
outlineWidth: 1.5,
|
|
246
258
|
disableDepthTestDistance: Number.POSITIVE_INFINITY,
|
|
247
|
-
heightReference: Cesium.HeightReference.CLAMP_TO_GROUND
|
|
259
|
+
heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
|
|
260
|
+
scaleByDistance: new Cesium.NearFarScalar(1000, 1.5, 5000000, 0.5)
|
|
248
261
|
}
|
|
249
262
|
})
|
|
250
263
|
}
|
|
251
264
|
|
|
252
265
|
const createDeleteButtonEntity = () => {
|
|
253
266
|
if (deleteButtonEntity || !endPosition) return
|
|
267
|
+
const outerGlow = map.entities.add({
|
|
268
|
+
id: `${tempIds.deleteButton}_outer_glow`,
|
|
269
|
+
position: new Cesium.CallbackProperty(() => getMidPosition(), false),
|
|
270
|
+
point: {
|
|
271
|
+
pixelSize: 32,
|
|
272
|
+
color: new Cesium.Color(0, 0.83, 1, 0.15),
|
|
273
|
+
disableDepthTestDistance: Number.POSITIVE_INFINITY,
|
|
274
|
+
heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
|
|
275
|
+
scaleByDistance: new Cesium.NearFarScalar(1000, 1.2, 5000000, 0.5)
|
|
276
|
+
}
|
|
277
|
+
})
|
|
278
|
+
const ring = map.entities.add({
|
|
279
|
+
id: `${tempIds.deleteButton}_ring`,
|
|
280
|
+
position: new Cesium.CallbackProperty(() => getMidPosition(), false),
|
|
281
|
+
ellipse: {
|
|
282
|
+
semiMinorAxis: 14,
|
|
283
|
+
semiMajorAxis: 14,
|
|
284
|
+
material: new Cesium.Color(0, 0.83, 1, 0.6),
|
|
285
|
+
outline: true,
|
|
286
|
+
outlineColor: new Cesium.Color(0, 0.83, 1, 0.9),
|
|
287
|
+
outlineWidth: 2,
|
|
288
|
+
height: 10,
|
|
289
|
+
disableDepthTestDistance: Number.POSITIVE_INFINITY,
|
|
290
|
+
scaleByDistance: new Cesium.NearFarScalar(1000, 1.2, 5000000, 0.5)
|
|
291
|
+
}
|
|
292
|
+
})
|
|
254
293
|
deleteButtonEntity = map.entities.add({
|
|
255
294
|
id: tempIds.deleteButton,
|
|
256
|
-
position: new Cesium.CallbackProperty(() =>
|
|
295
|
+
position: new Cesium.CallbackProperty(() => getMidPosition(), false),
|
|
296
|
+
point: {
|
|
297
|
+
pixelSize: 18,
|
|
298
|
+
color: new Cesium.Color(0.1, 0.2, 0.35, 0.95),
|
|
299
|
+
outlineColor: new Cesium.Color(0, 0.83, 1, 1),
|
|
300
|
+
outlineWidth: 2,
|
|
301
|
+
disableDepthTestDistance: Number.POSITIVE_INFINITY,
|
|
302
|
+
heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
|
|
303
|
+
scaleByDistance: new Cesium.NearFarScalar(1000, 1.2, 5000000, 0.5)
|
|
304
|
+
},
|
|
257
305
|
label: {
|
|
258
|
-
text: '
|
|
259
|
-
font: '
|
|
306
|
+
text: '✕',
|
|
307
|
+
font: 'bold 12px Arial',
|
|
308
|
+
fillColor: new Cesium.Color(0, 0.83, 1, 1),
|
|
260
309
|
style: Cesium.LabelStyle.FILL_AND_OUTLINE,
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
backgroundColor: Cesium.Color.fromCssColorString('rgba(244, 67, 54, 0.96)'),
|
|
266
|
-
backgroundPadding: new Cesium.Cartesian2(12, 7),
|
|
267
|
-
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
|
|
268
|
-
horizontalOrigin: Cesium.HorizontalOrigin.LEFT,
|
|
269
|
-
pixelOffset: new Cesium.Cartesian2(16, -34),
|
|
310
|
+
outlineColor: new Cesium.Color(0, 0.5, 1, 0.8),
|
|
311
|
+
outlineWidth: 3,
|
|
312
|
+
verticalOrigin: Cesium.VerticalOrigin.CENTER,
|
|
313
|
+
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
|
|
270
314
|
disableDepthTestDistance: Number.POSITIVE_INFINITY,
|
|
271
|
-
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0,
|
|
315
|
+
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 2000000),
|
|
316
|
+
scaleByDistance: new Cesium.NearFarScalar(1000, 1.2, 5000000, 0.5)
|
|
272
317
|
}
|
|
273
318
|
})
|
|
319
|
+
deleteButtonEntity.outerGlow = outerGlow
|
|
320
|
+
deleteButtonEntity.ring = ring
|
|
274
321
|
}
|
|
275
322
|
|
|
276
323
|
const removeTemporaryEntities = () => {
|
|
324
|
+
if (deleteButtonEntity) {
|
|
325
|
+
if (deleteButtonEntity.outerGlow) map.entities.remove(deleteButtonEntity.outerGlow)
|
|
326
|
+
if (deleteButtonEntity.ring) map.entities.remove(deleteButtonEntity.ring)
|
|
327
|
+
}
|
|
277
328
|
;[startPointEntity, endPointEntity, lineEntity, distanceLabelEntity, deleteButtonEntity, tipEntity].forEach((entity) => {
|
|
278
329
|
if (entity) map.entities.remove(entity)
|
|
279
330
|
})
|
|
@@ -312,13 +363,30 @@ export function measureDistance() {
|
|
|
312
363
|
const finalize = () => {
|
|
313
364
|
if (isFinished || !startPosition || !endPosition) return null
|
|
314
365
|
isFinished = true
|
|
315
|
-
|
|
366
|
+
if (handler) {
|
|
367
|
+
handler.destroy()
|
|
368
|
+
handler = null
|
|
369
|
+
}
|
|
316
370
|
if (tipEntity) {
|
|
317
371
|
map.entities.remove(tipEntity)
|
|
318
372
|
tipEntity = null
|
|
319
373
|
}
|
|
320
374
|
createEndPointEntity()
|
|
321
375
|
createDeleteButtonEntity()
|
|
376
|
+
deleteHandler = new Cesium.ScreenSpaceEventHandler(map.scene.canvas)
|
|
377
|
+
deleteHandler.setInputAction((movement) => {
|
|
378
|
+
const picked = map.scene.pick(movement.position)
|
|
379
|
+
if (!Cesium.defined(picked)) return
|
|
380
|
+
const pickedEntity = picked.id
|
|
381
|
+
if (!Cesium.defined(pickedEntity)) return
|
|
382
|
+
if (typeof pickedEntity === 'string' && pickedEntity === tempIds.deleteButton) {
|
|
383
|
+
destroyGraphic()
|
|
384
|
+
if (typeof options.onDelete === 'function') options.onDelete(options.id)
|
|
385
|
+
} else if (pickedEntity === deleteButtonEntity) {
|
|
386
|
+
destroyGraphic()
|
|
387
|
+
if (typeof options.onDelete === 'function') options.onDelete(options.id)
|
|
388
|
+
}
|
|
389
|
+
}, Cesium.ScreenSpaceEventType.LEFT_CLICK)
|
|
322
390
|
const result = buildResult()
|
|
323
391
|
const graphic = {
|
|
324
392
|
id: options.id,
|
|
@@ -376,15 +444,6 @@ export function measureDistance() {
|
|
|
376
444
|
cancel()
|
|
377
445
|
}, Cesium.ScreenSpaceEventType.RIGHT_CLICK)
|
|
378
446
|
|
|
379
|
-
deleteHandler = new Cesium.ScreenSpaceEventHandler(map.scene.canvas)
|
|
380
|
-
deleteHandler.setInputAction((movement) => {
|
|
381
|
-
const picked = map.scene.pick(movement.position)
|
|
382
|
-
const pickedEntity = picked?.id
|
|
383
|
-
if (!Cesium.defined(pickedEntity) || pickedEntity !== deleteButtonEntity) return
|
|
384
|
-
destroyGraphic()
|
|
385
|
-
if (typeof options.onDelete === 'function') options.onDelete(options.id)
|
|
386
|
-
}, Cesium.ScreenSpaceEventType.LEFT_CLICK)
|
|
387
|
-
|
|
388
447
|
return {
|
|
389
448
|
id: options.id,
|
|
390
449
|
finish: finalize,
|
|
@@ -430,3 +489,4 @@ export function measureDistance() {
|
|
|
430
489
|
formatDistance
|
|
431
490
|
}
|
|
432
491
|
}
|
|
492
|
+
|