| | |
| | | if (meters >= 1000) return `${(meters / 1000).toFixed(2)} km` |
| | | return `${meters.toFixed(2)} m` |
| | | } |
| | | |
| | | export const getBufferRadiusPoint = (centerCartesian, radius) => { |
| | | if (!centerCartesian || !Number.isFinite(radius)) return null |
| | | const frame = Cesium.Transforms.eastNorthUpToFixedFrame(centerCartesian) |
| | | const local = new Cesium.Cartesian3(radius, 0, 0) |
| | | return Cesium.Matrix4.multiplyByPoint(frame, local, new Cesium.Cartesian3()) |
| | | } |
| | | |
| | | export const getBufferRadiusLabelStyle = () => ({ |
| | | font: '14px Source Han Sans CN', |
| | | fillColor: Cesium.Color.WHITE, |
| | | outlineColor: Cesium.Color.fromBytes(24, 48, 92, 255), |
| | | outlineWidth: 2, |
| | | style: Cesium.LabelStyle.FILL_AND_OUTLINE, |
| | | showBackground: true, |
| | | backgroundColor: Cesium.Color.fromBytes(8, 12, 22, 180), |
| | | heightReference: Cesium.HeightReference.CLAMP_TO_GROUND, |
| | | verticalOrigin: Cesium.VerticalOrigin.BOTTOM, |
| | | horizontalOrigin: Cesium.HorizontalOrigin.CENTER, |
| | | pixelOffset: new Cesium.Cartesian2(0, -12), |
| | | disableDepthTestDistance: Number.POSITIVE_INFINITY, |
| | | }) |
| | | |
| | | export const addBufferRadiusLabelEntity = (dataSource, centerCartesian, radius, options = {}) => { |
| | | if (!dataSource) return null |
| | | const position = getBufferRadiusPoint(centerCartesian, radius) |
| | | if (!position) return null |
| | | const { name, customData } = options |
| | | return dataSource.entities.add({ |
| | | ...(name ? { name } : {}), |
| | | ...(customData ? { customData } : {}), |
| | | position, |
| | | label: { |
| | | ...getBufferRadiusLabelStyle(), |
| | | text: formatBufferRadius(radius), |
| | | }, |
| | | }) |
| | | } |