Cesium弹窗可随地图移动

目录

项目地址

https://github.com/zhengjie9510/webgis-demo

实现效果

实现方法

javascript 复制代码
handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas)
handler.setInputAction((click) => {
	if (listener) {
	  listener()
	  listener = undefined
	  this.visiable = false
	}
    // 球面
    if (viewer.terrainProvider instanceof Cesium.EllipsoidTerrainProvider) {
      earthPosition = viewer.scene.camera.pickEllipsoid(click.position);
    }
    // 地形
    else {
      const ray = viewer.camera.getPickRay(click.position);
      earthPosition = viewer.scene.globe.pick(ray, viewer.scene);
    }
    if (earthPosition) {
        const position = viewer.scene.globe.ellipsoid.cartesianToCartographic(earthPosition)
        const lon = Cesium.Math.toDegrees(position.longitude).toFixed(6)
        const lat = Cesium.Math.toDegrees(position.latitude).toFixed(6)
        const height = position.height.toFixed(2)
        this.info = { lon: lon, lat: lat, height: height }
        listener = viewer.scene.postRender.addEventListener(() => {
          const windowPosition = Cesium.SceneTransforms.wgs84ToWindowCoordinates(viewer.scene, earthPosition);
          if (windowPosition) {
            let position = { top: windowPosition.y - 115 + 'px', left: windowPosition.x - 200 / 2 + 'px' }
            this.style = Object.assign(this.style, position)
            this.visiable = true
          }
        })
    }
}, Cesium.ScreenSpaceEventType.LEFT_CLICK)
相关推荐
开发者小天2 小时前
调整为 dart-sass 支持的语法,将深度选择器/deep/调整为::v-deep
开发语言·前端·javascript·vue.js·uni-app·sass·1024程序员节
java水泥工5 小时前
课程答疑系统|基于SpringBoot和Vue的课程答疑系统(源码+数据库+文档)
spring boot·vue·计算机毕业设计·java毕业设计·大学生毕业设计·课程答疑系统
学习笔记1015 小时前
第十五章认识Ajax(六)
前端·javascript·ajax
theOtherSky8 小时前
element+vue3 table上下左右键切换input和select
javascript·vue.js·elementui·1024程序员节
会联营的陆逊8 小时前
JavaScript 如何优雅的实现一个时间处理插件
javascript
over6978 小时前
浏览器里的AI魔法:用JavaScript玩转自然语言处理
前端·javascript
Amy_cx9 小时前
搭建React Native开发环境
javascript·react native·react.js
代码AI弗森9 小时前
Python × NumPy」 vs 「JavaScript × TensorFlow.js」生态全景图
javascript·python·numpy
疏狂难除9 小时前
关于spiderdemo第二题的奇思妙想
javascript·爬虫
渣渣盟9 小时前
探索Word2Vec:从文本向量化到中文语料处理
前端·javascript·python·文本向量化