ThbTech/gis-bi
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

三维底图更换底图设置（高德，天地图，geoserver）

Browse Source
This commit is contained in:
wangxk 2025-07-25 17:48:52 +08:00
parent 92917c6c66
commit b6cbf1ccdd
11 changed files with 1090 additions and 1711 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
core/core-frontend/src/api/setting/sysParameter.ts
View File

@ -3,4 +3,6 @@ import request from '@/config/axios'
export const queryMapKeyApi = () => request.get({ url: '/sysParameter/queryOnlineMap' })
export const queryMapKeyApiByType = (type: string) =>
request.get({ url: `/sysParameter/queryOnlineMap/${type}` })
export const getMapServer = (id: string) =>
request.get({ url: `/dataVisualization/getMapServer/${id}` })
export const saveMapKeyApi = data => request.post({ url: '/sysParameter/saveOnlineMap', data })

2
core/core-frontend/src/components/data-visualization/canvas/Shape.vue
View File

@ -387,7 +387,7 @@ const boardMoveActive = computed(() => {
'heat-map',
't-heatmap',
'circle-packing',
'three-map'
'three-map',
]
return element.value.isPlugin || CHARTS.includes(element.value.innerType)
})

4
core/core-frontend/src/components/visualization/SettingMenu.vue
View File

@ -177,7 +177,7 @@ const state = reactive({
'flow-map',
'bidirectional-bar',
'symbolic-map',
'three-map'
'three-map',
],
linkageExcludeViewType: [
'richTextView',
@ -189,7 +189,7 @@ const state = reactive({
'flow-map',
'bidirectional-bar',
'symbolic-map',
'three-map'
'three-map',
],
copyData: null,
hyperlinksSetVisible: false,

6
core/core-frontend/src/locales/en.ts
View File

@ -1528,6 +1528,7 @@ export default {
export_details: 'Export details',
chart_data: 'Data',
chart_style: 'Style',
chart_base:'base map',
drag_block_type_axis: 'Category axis',
drag_block_type_axis_left: 'Left subcategory',
drag_block_type_axis_right: 'Right subcategory',
@ -1968,6 +1969,9 @@ export default {
hide: 'Hide',
show_label: 'Show label',
security_code: 'Security key',
map_interface:'url',
layer_name:'Layer Name',
update_base:'Update base map',
auto_fit: 'Adaptive zoom',
zoom_level: 'Zoom level',
central_point: 'Center point',
@ -2078,6 +2082,7 @@ export default {
no_data_or_not_positive: 'No data available, or all data are not positive, unable to plot',
map_type: 'Map Provider',
map_type_gaode: 'Gaode Map',
map_type_customize:'Geoserver',
map_type_tianditu: 'Tianditu',
map_type_baidu: 'Baidu Map',
map_type_tencent: 'Tencent Map',
@ -4609,6 +4614,7 @@ export default {
answer: 'Answering',
example: 'You can ask me: Pie chart of sales share of each sales department in 2020',
switch_chart: 'Switch chart type',
switch_base:'Switch base map',
switch_table: 'Switch to detailed table',
download: 'Download'
},

6
core/core-frontend/src/locales/tw.ts
View File

@ -1488,6 +1488,7 @@ export default {
export_details: '導出明細',
chart_data: '資料',
chart_style: '樣式',
chart_base:'底圖',
drag_block_type_axis: '類別軸',
drag_block_type_axis_left: '左子類別',
drag_block_type_axis_right: '右子類別',
@ -1861,6 +1862,7 @@ export default {
enable_view_loading: '圖表載入提示',
minute: '分',
switch_chart: '切換圖表',
switch_base:'切換底圖',
update_chart_data: '更新圖表資料',
second: '秒',
more_settings: '更多設定',
@ -1917,6 +1919,9 @@ export default {
hide: '隱藏',
show_label: '顯示標籤',
security_code: '安全金鑰',
map_interface:'url',
layer_name:'圖層名稱',
update_base:'更新底圖',
auto_fit: '自適應縮放',
zoom_level: '縮放等級',
central_point: '中心點',
@ -2019,6 +2024,7 @@ export default {
no_data_or_not_positive: '暫無數據，或數據均不是正數，無法繪製',
map_type: '地圖提供商',
map_type_gaode: '高德地圖',
map_type_customize:'geoserver服務',
map_type_tianditu: '天地圖',
map_type_baidu: '百度地圖',
map_type_tencent: '騰訊地圖',

6
core/core-frontend/src/locales/zh-CN.ts
View File

@ -1493,6 +1493,7 @@ export default {
export_details: '导出明細',
chart_data: '数据',
chart_style: '样式',
chart_base:'底图',
drag_block_type_axis: '类别轴',
drag_block_type_axis_left: '左子类别',
drag_block_type_axis_right: '右子类别',
@ -1866,6 +1867,7 @@ export default {
enable_view_loading: '图表加载提示',
minute: '分',
switch_chart: '切换图表',
switch_base:'切换底图',
update_chart_data: '更新图表数据',
second: '秒',
more_settings: '更多设置',
@ -1922,6 +1924,9 @@ export default {
hide: '隐藏',
show_label: '显示标签',
security_code: '安全密钥',
map_interface:'url',
layer_name:'图层名称',
update_base:'更新底图',
auto_fit: '自适应缩放',
zoom_level: '缩放等级',
central_point: '中心点',
@ -2025,6 +2030,7 @@ export default {
no_data_or_not_positive: '暂无数据，或数据均不是正数，无法绘制',
map_type: '地图提供商',
map_type_gaode: '高德地图',
map_type_customize:'geoserver服务',
map_type_tianditu: '天地图',
map_type_baidu: '百度地图',
map_type_tencent: '腾讯地图',

2349
core/core-frontend/src/views/chart/components/editor/index.vue
View File

File diff suppressed because it is too large Load Diff

40
core/core-frontend/src/views/chart/components/js/panel/charts/map/three-map.ts
View File

@ -14,17 +14,13 @@ import {
getMapScene,
getMapStyle,
} from '@/views/chart/components/js/panel/common/common_antv'
// import { dvMainStoreWithOut } from '@/store/modules/data-visualization/dvMain'
// import { storeToRefs } from 'pinia'
// const dvMainStore = dvMainStoreWithOut()
// const { curComponent } = storeToRefs(dvMainStore)
import { storeToRefs } from 'pinia'
import { dvMainStoreWithOut } from '@/store/modules/data-visualization/dvMain'
/**
* 三维地图
*/
// eventBus.on('createModel', createModel)
// function createModel(model){
// console.log('jiehsou',model)
// }
export class ThreeMap extends L7ChartView<Scene, L7Config> {
properties: EditorProperty[] = [
'background-overall-component',
@ -70,7 +66,7 @@ export class ThreeMap extends L7ChartView<Scene, L7Config> {
const { chart, container, action } = drawOption
const containerDom = document.getElementById(container)
const rect = containerDom?.getBoundingClientRect()
if (rect?.height <= 0) {
const observer = new ResizeObserver(() => {
observer.disconnect()
@ -79,21 +75,32 @@ export class ThreeMap extends L7ChartView<Scene, L7Config> {
observer.observe(containerDom)
return new L7Wrapper(drawOption.chartObj?.getScene(), [])
}
let basicStyle
let miscStyle
if (chart.customAttr) {
basicStyle = parseJson(chart.customAttr).basicStyle
miscStyle = parseJson(chart.customAttr).misc
}
const mapKey = await this.getMapKey()
const dvMainStore = dvMainStoreWithOut()
const {
curComponent
} = storeToRefs(dvMainStore)
let mapKey: any
if (curComponent.value && curComponent.value.mapServer) {
mapKey = curComponent.value.mapServer.find(server => server.status === true);
} else {
let allmapKey = await this.idGetMapKey(chart.id)
mapKey = allmapKey.find(server => server.status === true);
}
console.log('mapKey', mapKey)
const mapStyle = getMapStyle(mapKey, basicStyle)
let center = getMapCenter(basicStyle)
const chartObj = drawOption.chartObj as unknown as L7Wrapper<L7Config, Scene>
let scene = chartObj?.getScene()
// scene = chartObj?.getScene()
scene = await getMapScene(
chart,
scene,
@ -104,11 +111,10 @@ export class ThreeMap extends L7ChartView<Scene, L7Config> {
mapStyle,
center
)
this.configZoomButton(chart, scene, mapKey)
scene.render()
return new L7Wrapper(scene, []) // 只保留地图底图
}
}

329
core/core-frontend/src/views/chart/components/js/panel/common/common_antv.ts
View File

@ -25,7 +25,7 @@ import {
} from '@antv/l7plot-component/dist/esm/legend/category/constants'
import substitute from '@antv/util/esm/substitute'
import type { Plot as L7Plot, PlotOptions } from '@antv/l7plot/dist/esm'
import { Zoom } from '@antv/l7'
import { Zoom, RasterLayer } from '@antv/l7'
import { DOM } from '@antv/l7-utils'
import { Scene } from '@antv/l7-scene'
import { type IZoomControlOption } from '@antv/l7-component'
@ -36,7 +36,7 @@ import type { PickOptions } from '@antv/g2plot/lib/core/plot'
import { defaults, find } from 'lodash-es'
import { useI18n } from '@/hooks/web/useI18n'
import { isMobile } from '@/utils/utils'
import { GaodeMap, TMap, TencentMap } from '@antv/l7-maps'
import { GaodeMap, TMap, TencentMap, Map } from '@antv/l7-maps'
import {
gaodeMapStyleOptions,
qqMapStyleOptions,
@ -439,42 +439,42 @@ export function getXAxis(chart: Chart) {
const title =
a.nameShow && a.name && a.name !== ''
? {
text: a.name,
style: {
fill: a.color,
fontSize: a.fontSize
},
spacing: 8
}
text: a.name,
style: {
fill: a.color,
fontSize: a.fontSize
},
spacing: 8
}
: null
const grid = a.splitLine.show
? {
line: {
style: {
stroke: a.splitLine.lineStyle.color,
lineWidth: a.splitLine.lineStyle.width,
lineDash: getLineDash(a.splitLine.lineStyle.style)
}
line: {
style: {
stroke: a.splitLine.lineStyle.color,
lineWidth: a.splitLine.lineStyle.width,
lineDash: getLineDash(a.splitLine.lineStyle.style)
}
}
}
: null
const axisCfg = a.axisLine ? a.axisLine : DEFAULT_XAXIS_STYLE.axisLine
const line = axisCfg.show
? {
style: {
stroke: axisCfg.lineStyle.color,
lineWidth: axisCfg.lineStyle.width,
lineDash: getLineDash(axisCfg.lineStyle.style)
}
style: {
stroke: axisCfg.lineStyle.color,
lineWidth: axisCfg.lineStyle.width,
lineDash: getLineDash(axisCfg.lineStyle.style)
}
}
: null
const tickLine = axisCfg.show
? {
style: {
stroke: axisCfg.lineStyle.color,
lineWidth: axisCfg.lineStyle.width
}
style: {
stroke: axisCfg.lineStyle.color,
lineWidth: axisCfg.lineStyle.width
}
}
: null
let textAlign = 'center'
const rotate = a.axisLabel.rotate
@ -486,19 +486,19 @@ export function getXAxis(chart: Chart) {
}
const label = a.axisLabel.show
? {
rotate: (rotate * Math.PI) / 180,
style: {
fill: a.axisLabel.color,
fontSize: a.axisLabel.fontSize,
textAlign: textAlign,
fontFamily: chart.fontFamily
},
formatter: value => {
return chart.type === 'bidirectional-bar' && value.length > a.axisLabel.lengthLimit
? value.substring(0, a.axisLabel.lengthLimit) + '...'
: value
}
rotate: (rotate * Math.PI) / 180,
style: {
fill: a.axisLabel.color,
fontSize: a.axisLabel.fontSize,
textAlign: textAlign,
fontFamily: chart.fontFamily
},
formatter: value => {
return chart.type === 'bidirectional-bar' && value.length > a.axisLabel.lengthLimit
? value.substring(0, a.axisLabel.lengthLimit) + '...'
: value
}
}
: null
axis = {
@ -526,42 +526,42 @@ export function getYAxis(chart: Chart) {
const title =
yAxis.nameShow && yAxis.name && yAxis.name !== ''
? {
text: yAxis.name,
style: {
fill: yAxis.color,
fontSize: yAxis.fontSize
},
spacing: 8
}
text: yAxis.name,
style: {
fill: yAxis.color,
fontSize: yAxis.fontSize
},
spacing: 8
}
: null
const grid = yAxis.splitLine.show
? {
line: {
style: {
stroke: yAxis.splitLine.lineStyle.color,
lineWidth: yAxis.splitLine.lineStyle.width,
lineDash: getLineDash(yAxis.splitLine.lineStyle.style)
}
line: {
style: {
stroke: yAxis.splitLine.lineStyle.color,
lineWidth: yAxis.splitLine.lineStyle.width,
lineDash: getLineDash(yAxis.splitLine.lineStyle.style)
}
}
}
: null
const axisCfg = yAxis.axisLine ? yAxis.axisLine : DEFAULT_YAXIS_STYLE.axisLine
const line = axisCfg.show
? {
style: {
stroke: axisCfg.lineStyle.color,
lineWidth: axisCfg.lineStyle.width,
lineDash: getLineDash(axisCfg.lineStyle.style)
}
style: {
stroke: axisCfg.lineStyle.color,
lineWidth: axisCfg.lineStyle.width,
lineDash: getLineDash(axisCfg.lineStyle.style)
}
}
: null
const tickLine = axisCfg.show
? {
style: {
stroke: axisCfg.lineStyle.color,
lineWidth: axisCfg.lineStyle.width
}
style: {
stroke: axisCfg.lineStyle.color,
lineWidth: axisCfg.lineStyle.width
}
}
: null
const rotate = yAxis.axisLabel.rotate
let textAlign = 'end'
@ -591,20 +591,20 @@ export function getYAxis(chart: Chart) {
}
const label = yAxis.axisLabel.show
? {
rotate: (rotate * Math.PI) / 180,
style: {
fill: yAxis.axisLabel.color,
fontSize: yAxis.axisLabel.fontSize,
textBaseline,
textAlign,
fontFamily: chart.fontFamily
},
formatter: value => {
return value.length > yAxis.axisLabel.lengthLimit
? value.substring(0, yAxis.axisLabel.lengthLimit) + '...'
: value
}
rotate: (rotate * Math.PI) / 180,
style: {
fill: yAxis.axisLabel.color,
fontSize: yAxis.axisLabel.fontSize,
textBaseline,
textAlign,
fontFamily: chart.fontFamily
},
formatter: value => {
return value.length > yAxis.axisLabel.lengthLimit
? value.substring(0, yAxis.axisLabel.lengthLimit) + '...'
: value
}
}
: null
axis = {
@ -628,42 +628,42 @@ export function getYAxisExt(chart: Chart) {
const title =
yAxis.nameShow && yAxis.name && yAxis.name !== ''
? {
text: yAxis.name,
style: {
fill: yAxis.color,
fontSize: yAxis.fontSize
},
spacing: 8
}
text: yAxis.name,
style: {
fill: yAxis.color,
fontSize: yAxis.fontSize
},
spacing: 8
}
: null
const grid = yAxis.splitLine.show
? {
line: {
style: {
stroke: yAxis.splitLine.lineStyle.color,
lineWidth: yAxis.splitLine.lineStyle.width,
lineDash: getLineDash(yAxis.splitLine.lineStyle.style)
}
line: {
style: {
stroke: yAxis.splitLine.lineStyle.color,
lineWidth: yAxis.splitLine.lineStyle.width,
lineDash: getLineDash(yAxis.splitLine.lineStyle.style)
}
}
}
: null
const axisCfg = yAxis.axisLine ? yAxis.axisLine : DEFAULT_YAXIS_STYLE.axisLine
const line = axisCfg.show
? {
style: {
stroke: axisCfg.lineStyle.color,
lineWidth: axisCfg.lineStyle.width,
lineDash: getLineDash(axisCfg.lineStyle.style)
}
style: {
stroke: axisCfg.lineStyle.color,
lineWidth: axisCfg.lineStyle.width,
lineDash: getLineDash(axisCfg.lineStyle.style)
}
}
: null
const tickLine = axisCfg.show
? {
style: {
stroke: axisCfg.lineStyle.color,
lineWidth: axisCfg.lineStyle.width
}
style: {
stroke: axisCfg.lineStyle.color,
lineWidth: axisCfg.lineStyle.width
}
}
: null
const rotate = yAxis.axisLabel.rotate
let textAlign = 'end'
@ -693,15 +693,15 @@ export function getYAxisExt(chart: Chart) {
}
const label = yAxis.axisLabel.show
? {
rotate: (rotate * Math.PI) / 180,
style: {
fill: yAxis.axisLabel.color,
fontSize: yAxis.axisLabel.fontSize,
textBaseline,
textAlign,
fontFamily: chart.fontFamily
}
rotate: (rotate * Math.PI) / 180,
style: {
fill: yAxis.axisLabel.color,
fontSize: yAxis.axisLabel.fontSize,
textBaseline,
textAlign,
fontFamily: chart.fontFamily
}
}
: null
axis = {
@ -1454,6 +1454,7 @@ export function getMapStyle(
mapKey: { key: string; securityCode: string; mapType: string },
basicStyle: ChartBasicStyle
) {
//
let mapStyle: string
switch (mapKey.mapType) {
case 'tianditu':
@ -1490,56 +1491,34 @@ export async function getMapScene(
chart: Chart,
scene: Scene,
container: string,
mapKey: { key: string; securityCode: string; mapType: string },
mapKey: { key: string; securityCode: string; mapType: string, customize: string },
basicStyle: ChartBasicStyle,
miscStyle: ChartMiscAttr,
mapStyle: string,
center?: [number, number]
) {
if (!scene) {
scene = new Scene({
id: container,
logoVisible: false,
map: getMapObject(mapKey, basicStyle, miscStyle, mapStyle, center)
})
} else {
if (mapKey.mapType === 'tianditu') {
scene.map?.checkResize()
if (scene) {
// 销毁整个 Scene
try {
await scene.destroy();
} catch (e) {
console.warn('Scene destroy failed:', e);
}
if (scene.getLayers()?.length) {
await scene.removeAllLayer()
try {
scene.setPitch(miscStyle.mapPitch)
} catch (e) {}
if (mapKey.mapType === 'tianditu') {
if (mapStyle === 'normal') {
scene.map?.removeStyle()
} else {
scene.setMapStyle(mapStyle)
}
} else {
scene.setMapStyle(mapStyle)
}
scene.map.showLabel = !(basicStyle.showLabel === false)
if (mapKey.mapType === 'qq') {
scene.map.setBaseMap({
//底图设置（参数为：VectorBaseMap对象）
type: 'vector', //类型：失量底图
features: basicStyle.showLabel === false ? ['base', 'building2d'] : undefined
//仅渲染：道路及底面(base) + 2d建筑物(building2d)，以达到隐藏文字的效果
})
}
}
if (basicStyle.autoFit === false) {
scene.setZoomAndCenter(basicStyle.zoomLevel, center)
if (mapKey.mapType === 'qq') {
scene.map.deMapAutoFit = false
scene.map.deMapZoom = basicStyle.zoomLevel
scene.map.deMapCenter = center
}
scene = null;
}
// 🔥 清理天地图残留 DOM
const containerEl = typeof container === 'string' ? document.getElementById(container) : container;
if (containerEl) {
// 清除所有子元素（特别是天地图插入的 canvas/img）
while (containerEl.firstChild) {
containerEl.removeChild(containerEl.firstChild);
}
}
scene = new Scene({
id: container,
logoVisible: false,
map: getMapObject(mapKey, basicStyle, miscStyle, mapStyle, center)
})
mapRendering(container)
scene.once('loaded', () => {
mapRendered(container)
@ -1559,7 +1538,7 @@ export async function getMapScene(
// scene.map.deMapAutoLat = scene.map.getCenter().getLat()
}
// 去除天地图自己的缩放按钮
if (mapKey.mapType === 'tianditu') {
if (typeof scene.map.removeStyle === 'function') {
if (mapStyle === 'normal') {
scene.map?.removeStyle()
} else {
@ -1595,17 +1574,47 @@ export async function getMapScene(
}
}
}
if (mapKey.mapType === 'zidingyi') {
const wmsLayer = new RasterLayer({
zIndex: 2, // 图层叠加顺序
workerEnabled: false // 禁用WebWorker
});
wmsLayer.source(
// bbox=113.169069%2C35.1774017%2C117.526822%2C41.3747065
// GeoServer WMS 服务URL //url ，服务类型,版本，图层名，坐标系
// 更新URL参数：指定北京范围并启用透明
`${mapKey.url}/wms?` +
'service=WMS&version=1.1.0&request=GetMap&' +
`layers=${mapKey.layers}&` +
'BBOX={bbox}&' + // 北京大致范围
'width=768&height=556&' +
'srs=EPSG%3A4326&' +
'format=image/png&',
// 'tiled=true',
{
parser: {
type: 'rasterTile',
tileSize: 512, // 瓦片大小
zoomOffset: 0 // 缩放级别偏移
}
}
);
scene.addLayer(wmsLayer);
}
})
return scene
}
export function getMapObject(
mapKey: { key: string; securityCode: string; mapType: string },
mapKey: { key: string; securityCode: string; mapType: string, customize: string },
basicStyle: ChartBasicStyle,
miscStyle: ChartMiscAttr,
mapStyle: string,
center?: [number, number]
center?: [number, number],
) {
switch (mapKey.mapType) {
case 'tianditu':
return new TMap({
@ -1631,6 +1640,12 @@ export function getMapObject(
preserveDrawingBuffer: true
}
})
case 'zidingyi':
return new Map({
style: 'blank', // 关键！避免加载在线底图
center: [116.3956, 39.9392],
zoom: 10
})
default:
return new GaodeMap({
token: mapKey?.key ?? undefined,
@ -2233,15 +2248,15 @@ export function handleConditionsStyle(chart: Chart, options) {
...(options.tooltip['customItems']
? {}
: {
customItems: originalItems => {
originalItems.forEach(item => {
if (item.data?.[colorField]) {
item.color = item.data[colorField][0]
}
})
return originalItems
}
})
customItems: originalItems => {
originalItems.forEach(item => {
if (item.data?.[colorField]) {
item.color = item.data[colorField][0]
}
})
return originalItems
}
})
},
...(newColor ? { color: newColor } : {})
}
@ -2442,8 +2457,8 @@ export const configRoundAngle = (chart: Chart, styleName: string, callBack?: (da
? bottomRadius
: finalRadius
: isTopRound
? topRadius
: finalRadius,
? topRadius
: finalRadius,
...(callBack ? callBack(datum) : {})
}
}

7
core/core-frontend/src/views/chart/components/js/panel/types/impl/l7.ts
View File

@ -13,7 +13,7 @@ import {
configL7Tooltip,
configL7Zoom
} from '@/views/chart/components/js/panel/common/common_antv'
import { queryMapKeyApi } from '@/api/setting/sysParameter'
import { queryMapKeyApi,getMapServer } from '@/api/setting/sysParameter'
import { useMapStoreWithOut } from '@/store/modules/map'
const mapStore = useMapStoreWithOut()
@ -138,6 +138,11 @@ export abstract class L7ChartView<
}
return mapStore.mapKey
}
protected idGetMapKey = (id: any): Promise<any> => {
return getMapServer(id).then((res: any) => {
return JSON.parse(res.data)
})
}
protected abstract setupOptions(chart: Chart, options: O): O
}

50
core/core-frontend/src/views/chart/components/views/components/ChartComponentG2Plot.vue
View File

@ -421,32 +421,32 @@ const renderL7 = async (chart: ChartObj, chartView: L7ChartView<any, any>, callb
chart: chart,
action
});
// 清除已有比例尺
if (!scaleControl) {
scaleControl = new Scale({
position: 'bottomleft',
imperial: false
});
myChart.getScene()?.addControl(scaleControl);
}
// 添加全屏控件
if (fullscreenControl) {
// // 清除已有比例尺
// if (!scaleControl) {
// scaleControl = new Scale({
// position: 'bottomleft',
// imperial: false
// });
// myChart.getScene()?.addControl(scaleControl);
// }
// // 添加全屏控件
// if (fullscreenControl) {
} else {
fullscreenControl = new Fullscreen({
position: 'bottomright',
});
myChart.getScene()?.addControl(fullscreenControl, 'bottomright');
}
// ====== 使用高德地图原生API实现卫星图层切换 ======
// 添加控件到地图
// 移除之前的卫星控件（如果存在）
if (!satelliteControlInstance) {
// 添加新的卫星控件到地图
satelliteControlInstance = new SatelliteControl({ position: 'bottomright' });
myChart.getScene()?.addControl(satelliteControlInstance);
}
if (view.value.type == 'three-map') {
// } else {
// fullscreenControl = new Fullscreen({
// position: 'bottomright',
// });
// myChart.getScene()?.addControl(fullscreenControl, 'bottomright');
// }
// // ====== 使用高德地图原生API实现卫星图层切换 ======
// // 添加控件到地图
// // 移除之前的卫星控件（如果存在）
// if (!satelliteControlInstance) {
// // 添加新的卫星控件到地图
// satelliteControlInstance = new SatelliteControl({ position: 'bottomright' });
// myChart.getScene()?.addControl(satelliteControlInstance);
// }
if (view.value.type == 'three-map' ) {
// debugger
if (curComponent.value && curComponent.value.threeModel && curComponent.value.threeModel.length > 0) {
curComponent.value.threeModel.forEach((item: any) => {