cesium 坐标转换

xiaoxiao2021-02-28  11

[html]  view plain  copy   

修改于2017.1.9

(1)坐标系转换

cesium中常用的坐标有两种WGS84地理坐标系和笛卡尔空间坐标系(世界坐标)。我们平时常用的以经纬度来指明一个地点就是用的WGS84坐标,笛卡尔空间坐标系常用来做一些空间位置变换如平移旋转缩放等等。二者的联系如下图, 笛卡尔空间坐标的原点就是椭球的中心.

  Pick----屏幕坐标   Cartesian----世界坐标  cartographic-----地理坐标(弧度) Point----经纬度坐标 1.屏幕坐标转世界坐标 var pick= new Cesium.Cartesian2(window.innerWidth,window.innerHeight); var cartesian = scene.globe.pick(viewer.camera.getPickRay(pick), scene);

注:一共是两步

(在2D下上述方法不适用,改成:

var pick= new Cesium.Cartesian2(0,0); var cartesian = viewer.camera.pickEllipsoid(pick, viewer.scene.globe.ellipsoid);

)

2.世界坐标转地理坐标(弧度) var cartographic = scene.globe.ellipsoid.cartesianToCartographic(cartesian); var cartographic = Cesium.Cartographic.fromCartesian(cartesian); 3.世界坐标转屏幕坐标 var pick = Cesium.SceneTransforms.wgs84ToWindowCoordinates(viewer.scene, cartesian); 4.地理坐标(弧度)转经纬度坐标 var point=[ cartographic.longitude / Math.PI * 180, cartographic.latitude / Math.PI * 180]; 5.地理坐标(弧度)转世界坐标 var  cartesian = scene.globe.ellipsoid. cartographicTo Cartesian (cartographic); 6.经纬度坐标转地理坐标(弧度) var cartographic = Cesium.Cartographic.fromDegree(point); 7.经纬度坐标转世界坐标 var  cartesian  =  Cesium. Cartesian 3.fromDegree(point); (2)事件 1.相机事件(移动开始、移动结束等等) viewer.scene.camera.moveEnd.addEventListener(function(){ }); 2.鼠标事件(单击、移动、右键等) var handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas); handler.setInputAction(function (movement) { }, Cesium.ScreenSpaceEventType.MOUSE_MOVE); 3.渲染事件(实时渲染,很关键的一个事件) var renderEnd = viewer.scene.postRender.addEventListener(function(){ }); (4)鼠标移到标牌上,提示信息(div)。 首先根据上面提到的鼠标事件,new一个ScreenSpaceEventHandler,然后监听它的move。 当鼠标移到标牌上时,利用pick方法获取鼠标下的entity, var pick = viewer.scene.pick(movement.position);   作用:返回带有“primitive”属性的一个对象,这个primitive是在特定窗口坐标的第一个或是最上面的primitive;如果在这个位置上没有东西,就返回undefined。

利用这个方法就可以判断鼠标下面是否有标牌,如果有,有create一个div或者令一个隐藏的div显示,移除时候再移除div或者设置div的display为none

[html]  view plain  copy var handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);           handler.setInputAction(function (movement) {               var pick = viewer.scene.pick(movement.endPosition);               if(!temp && Cesium.defined(pick)){                   if(pick.mesh){                       document.getElementById("modelName").textContent=pick.mesh._name;                   }else{                       document.getElementById("modelName").textContent="Name";                   }                   var pos = getPos(event);                   document.getElementById("modelInfo").style.left = pos.x +"px";                   document.getElementById("modelInfo").style.top = pos.y +"px";                   document.getElementById("modelInfo").style.display = "block";               }else{                   document.getElementById("modelInfo").style.display = "none";               }           }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);  

(5)鼠标点击标牌,提示信息(div),并且信息能够一直随着物体移动。 跟上一个差不许多,关键是解决如何能够随着物体一起移动。此时就需要postRender事件了。在这里需要提示一下,如果你的是22版本以上的,相机事件里面应该有个changed事件,利用这个也可以实现随物体一直移动的功能。    现在我就讲一下如果是低版本,相机里没有changed事件的话,就需要postRender事件了。 用pick获取标牌实体后,里面会找他的一个世界坐标位置的属性,将此位置实时的定位到窗口坐标,即可实现div一直跟随标牌移动了。
转载请注明原文地址: https://www.6miu.com/read-2100350.html

最新回复(0)