地图联动事件优化
parent
34c2056ca4
commit
22e837192d
|
|
@ -1,21 +1,17 @@
|
|||
// 地图函数列表
|
||||
export function mapFun() {
|
||||
const ceshiClick = () => {
|
||||
console.log('ceshi');
|
||||
alert('ceshi');
|
||||
};
|
||||
|
||||
// 根据坐标点跳转位置
|
||||
const handlerFlyToPoint = (params) => {
|
||||
window.globalMap.flyToPoint([118.000666,35.11987],
|
||||
{"alt":4269.7,"heading":359.2,"pitch":-51.9});
|
||||
}
|
||||
|
||||
|
||||
const handlerAddEntity = (data) => {
|
||||
window.globalMap.flyToPoint([118.000666, 35.11987], {
|
||||
alt: 4269.7,
|
||||
heading: 359.2,
|
||||
pitch: -51.9,
|
||||
});
|
||||
};
|
||||
|
||||
const handlerAddEntity = (data) => {
|
||||
let graphicOptions = {
|
||||
id:data.id,
|
||||
id: data.id,
|
||||
position: [parseFloat(data.position.lng), parseFloat(data.position.lat)],
|
||||
style: {
|
||||
image: data.image.generalIcon,
|
||||
|
|
@ -24,7 +20,7 @@ export function mapFun() {
|
|||
label: {
|
||||
text: data.attribute.label,
|
||||
font_size: 14,
|
||||
color: "#ffffff",
|
||||
color: '#ffffff',
|
||||
pixelOffsetY: 10,
|
||||
distanceDisplayCondition: true,
|
||||
distanceDisplayCondition_far: 500000,
|
||||
|
|
@ -67,52 +63,52 @@ export function mapFun() {
|
|||
</div>`,
|
||||
popupOptions: {
|
||||
offsetY: -30,
|
||||
template: "{content}",
|
||||
horizontalOrigin: "Cesium.HorizontalOrigin.LEFT",
|
||||
verticalOrigin: "Cesium.VerticalOrigin.CENTER",
|
||||
template: '{content}',
|
||||
horizontalOrigin: 'Cesium.HorizontalOrigin.LEFT',
|
||||
verticalOrigin: 'Cesium.VerticalOrigin.CENTER',
|
||||
},
|
||||
}
|
||||
|
||||
let graphic = window.graphicLayer.getGraphicById(data.id);
|
||||
|
||||
if(graphic){
|
||||
graphic.setStyleOptions(graphicOptions);
|
||||
}else{
|
||||
graphic = new mars3d.graphic.BillboardEntity(graphicOptions);
|
||||
};
|
||||
|
||||
window.graphicLayer.addGraphic(graphic);
|
||||
let graphic = window.graphicLayer.getGraphicById(data.id);
|
||||
|
||||
if (graphic) {
|
||||
graphic.setStyleOptions(graphicOptions);
|
||||
} else {
|
||||
graphic = new mars3d.graphic.BillboardEntity(graphicOptions);
|
||||
|
||||
window.graphicLayer.addGraphic(graphic);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const handlerMeasureSurfaceLength = async () => {
|
||||
const graphic = await window.measureTool.distanceSurface({
|
||||
showAddText: true,
|
||||
exact: false
|
||||
})
|
||||
}
|
||||
exact: false,
|
||||
});
|
||||
};
|
||||
|
||||
const handlerMeasureLength = async () => {
|
||||
const graphic = await window.measureTool.distance({
|
||||
showAddText: true,
|
||||
label: {
|
||||
type: "div",
|
||||
type: 'div',
|
||||
updateText: function (text, graphic) {
|
||||
graphic.html = `<div class="marsGreenGradientPnl" >${text}</div>`
|
||||
graphic.html = `<div class="marsGreenGradientPnl" >${text}</div>`;
|
||||
},
|
||||
html: `<div class="marsGreenGradientPnl" ></div>`,
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const handlerMeasureSurfaceArea = async () => {
|
||||
const graphic = await window.measureTool.areaSurface({
|
||||
style: {
|
||||
color: "#ffff00"
|
||||
color: '#ffff00',
|
||||
},
|
||||
splitNum: 10, // step插值分割的个数
|
||||
exact: false // 是否进行精确计算， 传false时是否快速概略计算方式，该方式计算精度较低，但计算速度快，仅能计算在当前视域内坐标的高度
|
||||
})
|
||||
}
|
||||
exact: false, // 是否进行精确计算， 传false时是否快速概略计算方式，该方式计算精度较低，但计算速度快，仅能计算在当前视域内坐标的高度
|
||||
});
|
||||
};
|
||||
|
||||
const handlerMeasureArea = async () => {
|
||||
const graphic = await window.measureTool.area({
|
||||
|
|
@ -122,15 +118,15 @@ export function mapFun() {
|
|||
outline: true,
|
||||
outlineColor: '#fafa5a',
|
||||
outlineWidth: 1,
|
||||
clampToGround: false //贴地
|
||||
}
|
||||
})
|
||||
}
|
||||
clampToGround: false, //贴地
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const handlerMeasurePoint = async () => {
|
||||
const graphic = await window.measureTool.point({
|
||||
popupOptions: {
|
||||
pointerEvents: false
|
||||
pointerEvents: false,
|
||||
},
|
||||
popup: function (point, event) {
|
||||
return `<div class="mars3d-template-title">位置信息</div>
|
||||
|
|
@ -138,36 +134,34 @@ export function mapFun() {
|
|||
<div><label>经度</label>${point.lng}</div>
|
||||
<div><label>纬度</label>${point.lat}</div>
|
||||
<div><label>海拔</label>${point.alt}米</div>
|
||||
</div>`
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
</div>`;
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const handlerMeasureHeight = async () => {
|
||||
const graphic = await window.measureTool.height();
|
||||
}
|
||||
};
|
||||
|
||||
const handlerClearMeasure = () => {
|
||||
const handlerClearMeasure = () => {
|
||||
window.measureTool.clear();
|
||||
}
|
||||
};
|
||||
|
||||
const handlerDrawPolygon = async () => {
|
||||
const graphic = await graphicLayer.startDraw({
|
||||
type: "polygon",
|
||||
type: 'polygon',
|
||||
style: {
|
||||
color: "#3388ff",
|
||||
color: '#3388ff',
|
||||
opacity: 0.5,
|
||||
outline: true,
|
||||
outlineColor: "#ffffff",
|
||||
outlineColor: '#ffffff',
|
||||
outlineWidth: 2.0,
|
||||
clampToGround:true
|
||||
}
|
||||
})
|
||||
}
|
||||
clampToGround: true,
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
return {
|
||||
ceshiClick,
|
||||
handlerFlyToPoint,
|
||||
handlerAddEntity,
|
||||
handlerMeasureSurfaceLength,
|
||||
|
|
@ -177,116 +171,110 @@ export function mapFun() {
|
|||
handlerMeasurePoint,
|
||||
handlerMeasureHeight,
|
||||
handlerClearMeasure,
|
||||
handlerDrawPolygon
|
||||
handlerDrawPolygon,
|
||||
};
|
||||
}
|
||||
|
||||
// 地图函数列表options
|
||||
export const funSelectOptions = [
|
||||
{
|
||||
// 事件名称（用于选择显示）
|
||||
label: 'ceshi点击',
|
||||
// 事件名(用于触发)
|
||||
value: 'ceshiClick',
|
||||
label: '根据坐标定位地图视角',
|
||||
value: 'handlerFlyToPoint',
|
||||
},
|
||||
{
|
||||
label:"根据坐标定位地图视角",
|
||||
value: 'handlerFlyToPoint'
|
||||
label: '添加任意类型图层',
|
||||
value: 'handlerAddLayer',
|
||||
},
|
||||
{
|
||||
label:"添加任意类型图层",
|
||||
value: 'handlerAddLayer'
|
||||
label: '隐藏任意类型图层',
|
||||
value: 'handlerHiddenLayer',
|
||||
},
|
||||
{
|
||||
label:"隐藏任意类型图层",
|
||||
value: 'handlerHiddenLayer'
|
||||
label: '删除任意类型图层',
|
||||
value: 'handlerRemoveLayer',
|
||||
},
|
||||
{
|
||||
label:"删除任意类型图层",
|
||||
value: 'handlerRemoveLayer'
|
||||
label: '添加单个矢量数据',
|
||||
value: 'handlerAddEntity',
|
||||
},
|
||||
{
|
||||
label:"添加单个矢量数据",
|
||||
value: 'handlerAddEntity'
|
||||
label: '隐藏单个矢量数据',
|
||||
value: 'handlerHiddenEntity',
|
||||
},
|
||||
{
|
||||
label:"隐藏单个矢量数据",
|
||||
value:"handlerHiddenEntity"
|
||||
label: '移除单个矢量数据',
|
||||
value: 'handlerRemoveEntity',
|
||||
},
|
||||
{
|
||||
label:"移除单个矢量数据",
|
||||
value:"handlerRemoveEntity"
|
||||
label: '定位和高亮矢量数据',
|
||||
value: 'handlerFlyToEntity',
|
||||
},
|
||||
{
|
||||
label:"定位和高亮矢量数据",
|
||||
value:"handlerFlyToEntity"
|
||||
label: '清除全部矢量数据',
|
||||
value: 'handlerClearEntityLayer',
|
||||
},
|
||||
{
|
||||
label:"清除全部矢量数据",
|
||||
value:"handlerClearEntityLayer"
|
||||
label: '隐藏全部矢量数据',
|
||||
value: 'handlerHiddenEntityLayer',
|
||||
},
|
||||
{
|
||||
label:"隐藏全部矢量数据",
|
||||
value:"handlerHiddenEntityLayer"
|
||||
label: '点击地图拾取坐标',
|
||||
value: 'handlerDrawPoint',
|
||||
},
|
||||
{
|
||||
label:"点击地图拾取坐标",
|
||||
value:"handlerDrawPoint"
|
||||
label: '绘制贴地线',
|
||||
value: 'handlerDrawLine',
|
||||
},
|
||||
{
|
||||
label:"绘制贴地线",
|
||||
value:"handlerDrawLine"
|
||||
label: '绘制图标点',
|
||||
value: 'handlerDrawIconPoint',
|
||||
},
|
||||
{
|
||||
label:"绘制图标点",
|
||||
value:"handlerDrawIconPoint"
|
||||
label: '绘制贴地线',
|
||||
value: 'handlerDrawLine',
|
||||
},
|
||||
{
|
||||
label:"绘制贴地线",
|
||||
value:"handlerDrawLine"
|
||||
label: '绘制贴地自由线',
|
||||
value: 'handlerDrawBrushLine',
|
||||
},
|
||||
{
|
||||
label:"绘制贴地自由线",
|
||||
value:"handlerDrawBrushLine"
|
||||
label: '绘制贴地面',
|
||||
value: 'handlerDrawLine',
|
||||
},
|
||||
{
|
||||
label:"绘制贴地面",
|
||||
value:"handlerDrawLine"
|
||||
label: '绘制贴地矩形',
|
||||
value: 'handlerDrawRectangle',
|
||||
},
|
||||
{
|
||||
label:"绘制贴地矩形",
|
||||
value:"handlerDrawRectangle"
|
||||
label: '绘制贴地面',
|
||||
value: 'handlerDrawPolygon',
|
||||
},
|
||||
{
|
||||
label:"绘制贴地面",
|
||||
value:"handlerDrawPolygon"
|
||||
label: '贴地距离测量',
|
||||
value: 'handlerMeasureSurfaceLength',
|
||||
},
|
||||
{
|
||||
label:"贴地距离测量",
|
||||
value:"handlerMeasureSurfaceLength"
|
||||
label: '空间距离测量',
|
||||
value: 'handlerMeasureLength',
|
||||
},
|
||||
{
|
||||
label:"空间距离测量",
|
||||
value:"handlerMeasureLength"
|
||||
label: '贴地面积测量',
|
||||
value: 'handlerMeasureSurfaceArea',
|
||||
},
|
||||
{
|
||||
label:"贴地面积测量",
|
||||
value:"handlerMeasureSurfaceArea"
|
||||
label: '水平面积测量',
|
||||
value: 'handlerMeasureArea',
|
||||
},
|
||||
{
|
||||
label:"水平面积测量",
|
||||
value:"handlerMeasureArea"
|
||||
label: '坐标点位测量',
|
||||
value: 'handlerMeasurePoint',
|
||||
},
|
||||
{
|
||||
label:"坐标点位测量",
|
||||
value:"handlerMeasurePoint"
|
||||
label: '高度差测量',
|
||||
value: 'handlerMeasureHeight',
|
||||
},
|
||||
{
|
||||
label:"高度差测量",
|
||||
value:"handlerMeasureHeight"
|
||||
label: '清空测量数据',
|
||||
value: 'handlerClearMeasure',
|
||||
},
|
||||
{
|
||||
label:"清空测量数据",
|
||||
value:"handlerClearMeasure"
|
||||
}
|
||||
];
|
||||
|
|
|
|||
|
|
@ -125,97 +125,10 @@
|
|||
import { getMenuList } from '@/api/sys/menu';
|
||||
import { previewPath } from '@/utils';
|
||||
import { projectListApi } from '@/api/path/project.api';
|
||||
import { funSelectOptions } from '@/hooks/ceshiFun.hook';
|
||||
|
||||
const { chartEditStore } = useTargetData();
|
||||
const routeOptions = ref([]);
|
||||
const funSelectOptions = ref([
|
||||
{
|
||||
// 事件名称（用于选择显示）
|
||||
label: 'ceshi点击',
|
||||
// 事件名(用于触发)
|
||||
value: 'ceshiClick',
|
||||
},
|
||||
{
|
||||
label: '根据坐标定位地图视角',
|
||||
value: 'handlerFlyToPoint',
|
||||
},
|
||||
{
|
||||
label: '添加任意类型图层',
|
||||
value: 'handlerAddLayer',
|
||||
},
|
||||
{
|
||||
label: '隐藏任意类型图层',
|
||||
value: 'handlerHiddenLayer',
|
||||
},
|
||||
{
|
||||
label: '删除任意类型图层',
|
||||
value: 'handlerRemoveLayer',
|
||||
},
|
||||
{
|
||||
label: '添加单个矢量数据',
|
||||
value: 'handlerAddEntity',
|
||||
},
|
||||
{
|
||||
label: '隐藏单个矢量数据',
|
||||
value: 'handlerHiddenEntity',
|
||||
},
|
||||
{
|
||||
label: '移除单个矢量数据',
|
||||
value: 'handlerRemoveEntity',
|
||||
},
|
||||
{
|
||||
label: '定位和高亮矢量数据',
|
||||
value: 'handlerFlyToEntity',
|
||||
},
|
||||
{
|
||||
label: '清除全部矢量数据',
|
||||
value: 'handlerClearEntityLayer',
|
||||
},
|
||||
{
|
||||
label: '隐藏全部矢量数据',
|
||||
value: 'handlerHiddenEntityLayer',
|
||||
},
|
||||
{
|
||||
label: '点击地图拾取坐标',
|
||||
value: 'handlerDrawPoint',
|
||||
},
|
||||
{
|
||||
label: '绘制贴地线',
|
||||
value: 'handlerDrawLine',
|
||||
},
|
||||
{
|
||||
label: '绘制贴地面',
|
||||
value: 'handlerDrawPolygon',
|
||||
},
|
||||
{
|
||||
label: '贴地距离测量',
|
||||
value: 'handlerMeasureSurfaceLength',
|
||||
},
|
||||
{
|
||||
label: '空间距离测量',
|
||||
value: 'handlerMeasureLength',
|
||||
},
|
||||
{
|
||||
label: '贴地面积测量',
|
||||
value: 'handlerMeasureSurfaceArea',
|
||||
},
|
||||
{
|
||||
label: '水平面积测量',
|
||||
value: 'handlerMeasureArea',
|
||||
},
|
||||
{
|
||||
label: '坐标点位测量',
|
||||
value: 'handlerMeasurePoint',
|
||||
},
|
||||
{
|
||||
label: '高度差测量',
|
||||
value: 'handlerMeasureHeight',
|
||||
},
|
||||
{
|
||||
label: '清空测量数据',
|
||||
value: 'handlerClearMeasure',
|
||||
},
|
||||
]);
|
||||
const skipTypeOptions = ref([
|
||||
{
|
||||
label: '外部链接',
|
||||
|
|
|
|||
Loading…
Reference in New Issue