点击地图加点并添加图标(已规划导航路线选取终点起点为例)
首先是点击获取坐标
getPosition(item) {
this.point = item
const that = this
that.pickState = true
const handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas)
handler.setInputAction(function(movement) {
viewer.scene.globe.depthTestAgainstTerrain = true
var position = viewer.scene.pickPosition(movement.position)
if (that.pickState) {
showPointRouteOnMap(that.point, position)
}
that.pickState = false
viewer.scene.globe.depthTestAgainstTerrain = false
}, Cesium.ScreenSpaceEventType.LEFT_CLICK)
}
拿到笛卡尔坐标后加点
const endFlag = 'end'
const startFlag = 'start'
function showPointRouteOnMap(imgtype, position) {
return new Promise((resolve, reject) => {
try {
if (startFlag === imgtype) {
removeDataSource('start-end' + 'start')
}
if (endFlag === imgtype) {
removeDataSource('start-end' + 'end')
}
viewer = window.viewer
const sourceName = 'start-end' + imgtype
const dataSource = new Cesium.CustomDataSource(sourceName)
const image = `img/marker/resource/${imgtype}.png`
dataSource.entities.add({
position: position,
billboard: {
image: image,
scale: 1,
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
heightReference: Cesium.HeightReference.CLAMP_TO_GROUND
}
})
viewer.dataSources.add(dataSource)
} catch (e) {
reject(e)
}
})
}