|
@@ -107,7 +107,6 @@ export default defineComponent({
|
|
|
map.value.clearOverlays();
|
|
map.value.clearOverlays();
|
|
|
|
|
|
|
|
const zoomLevel = map.value.getZoom();
|
|
const zoomLevel = map.value.getZoom();
|
|
|
- debugger
|
|
|
|
|
if (zoomLevel > 10) {
|
|
if (zoomLevel > 10) {
|
|
|
// 高缩放级别下显示单个设备标记
|
|
// 高缩放级别下显示单个设备标记
|
|
|
devices.value.forEach(device => {
|
|
devices.value.forEach(device => {
|
|
@@ -166,6 +165,40 @@ export default defineComponent({
|
|
|
|
|
|
|
|
const createClusterLabel = (cluster: Cluster, point: any) => {
|
|
const createClusterLabel = (cluster: Cluster, point: any) => {
|
|
|
debugger
|
|
debugger
|
|
|
|
|
+ // const labelStyle = {
|
|
|
|
|
+ // // 基础样式
|
|
|
|
|
+ // color: '#2d3436', // 深灰色文字
|
|
|
|
|
+ // fontSize: '14px',
|
|
|
|
|
+ // fontWeight: 500,
|
|
|
|
|
+ // fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif',
|
|
|
|
|
+ // backgroundColor: 'rgba(255, 255, 255, 0.95)', // 半透明白色背景
|
|
|
|
|
+ // border: '1px solid rgba(0, 0, 0, 0.05)', // 极细边框
|
|
|
|
|
+ // borderRadius: '6px',
|
|
|
|
|
+ // padding: '8px 16px',
|
|
|
|
|
+ // whiteSpace: 'nowrap',
|
|
|
|
|
+ // boxShadow: '0 3px 6px -1px rgba(0, 0, 0, 0.1)', // 柔和投影
|
|
|
|
|
+ //
|
|
|
|
|
+ // // 文字样式
|
|
|
|
|
+ // textShadow: '0 1px 0 rgba(255, 255, 255, 0.8)',
|
|
|
|
|
+ // letterSpacing: '0.5px',
|
|
|
|
|
+ //
|
|
|
|
|
+ // // 交互相关
|
|
|
|
|
+ // cursor: 'default',
|
|
|
|
|
+ // userSelect: 'none',
|
|
|
|
|
+ // transition: 'all 0.2s cubic-bezier(0.4, 0, 0.2, 1)' // 流畅动画
|
|
|
|
|
+ // }
|
|
|
|
|
+ //
|
|
|
|
|
+ // // 创建标签实例
|
|
|
|
|
+ // const label = new BMapGL.Label(cluster.count.toString(), {
|
|
|
|
|
+ // position: point,
|
|
|
|
|
+ // offset: new BMapGL.Size(
|
|
|
|
|
+ // -parseInt(labelStyle.padding.split(' ')[1].replace('px', '')) / 2,
|
|
|
|
|
+ // -parseInt(labelStyle.padding.split(' ')[0].replace('px', '')) - 12 // 垂直居中偏移
|
|
|
|
|
+ // )
|
|
|
|
|
+ // })
|
|
|
|
|
+ //
|
|
|
|
|
+ // // 应用样式
|
|
|
|
|
+ // label.setStyle(labelStyle)
|
|
|
const label = new (window as any).BMap.Label(cluster.count.toString(), {
|
|
const label = new (window as any).BMap.Label(cluster.count.toString(), {
|
|
|
position: point,
|
|
position: point,
|
|
|
offset: new (window as any).BMap.Size(-10, -10)
|
|
offset: new (window as any).BMap.Size(-10, -10)
|
