cesium 地图添加广告牌点线

 如同有两种方式

1.开启高程遮挡,创建两个点一条线

// 开始高程遮挡效果
viewer.scene.globe.depthTestAgainstTerrain = true

let position1 = Cesium.Cartesian3.fromDegrees(longitude, latitude, height)
let position2 = Cesium.Cartesian3.fromDegrees(longitude, latitude, 0)
let point1 = new Cesium.Entity({
    position: position1,
    point: {
        color: Cesium.Color.WHITE,
        pixelSize: 20, // 像素点大小
        outlineWidth: 2, // 点的外圈线宽度
        disableDepthTestDistance: Number.POSITIVE_INFINITY, // 被遮挡是否可见(也就是将这个Entity在场景中置顶)
        // heightReference: Cesium.HeightReference.CLAMP_TO_GROUND, // 贴地
    },   
label: {
    text: '1',
    showBackground: true,
    font: '20px sans-serif', // 字体大小
    style: Cesium.LabelStyle.FILL_AND_OUTLINE, // 字体样式
    pixelOffset: new Cesium.Cartesian2(-8, -35), // 偏移量
    fillColor: Cesium.Color.fromCssColorString('#ffffff'), // 字体填充色
    outlineWidth: 1, // 字体外圈线宽度(同样也有颜色可设置)
    outlineColor: Cesium.Color.fromCssColorString('#ffffff'),
    verticalOrigin: Cesium.VerticalOrigin.BOTTOM, // 垂直位置
    disableDepthTestDistance: Number.POSITIVE_INFINITY
    },
},)
let point2 = new Cesium.Entity({
    position: position2,
    point: {
        color: Cesium.Color.WHITE,
        pixelSize: 10, // 像素点大小
        disableDepthTestDistance: Number.POSITIVE_INFINITY, // 被遮挡是否可见(也就是将这个Entity在场景中置顶)
        heightReference: Cesium.HeightReference.CLAMP_TO_GROUND, // 贴地
    },
    },
)
// 加载线条
let line = new Cesium.Entity({
    name: 'line', // 线的name属性
    polyline: { // 线
    positions: [position1, position2], // 由点构线
    width: 5.0, // 线的宽度
    material: new Cesium.PolylineDashMaterialProperty({
        color: Cesium.Color.WHITE,
        dashLength: 40, // 短划线长度
    }), // 线的材质、样式
    }
})

2.关闭高程,获取点的地形高度,然后将上面的position1的高度0换掉。其他的都是一样的

// 获取改点的经纬高
let terrainProvider = Cesium.createWorldTerrain()
let positions = [Cesium.Cartographic.fromDegrees(lng, lat)]
let promise = Cesium.sampleTerrainMostDetailed(terrainProvider, positions)
Cesium.when(promise, function (updatedPositions:any) {
    let terrainHeight = updatedPositions[0].height
})

注意:获取地形高度是异步的,而且感觉有点慢尽量采用第一种

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Y_Hungry

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值