Cesium学习笔记(2)
来源:互联网 发布:淘宝助理怎么导出订单 编辑:程序博客网 时间:2024/04/29 23:05
修改于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
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一直跟随标牌移动了。
2 0
- Cesium学习笔记(2)
- Cesium学习笔记(3)
- Cesium学习笔记(4)
- Cesium学习笔记(5)
- Cesium学习笔记(四): 相机(camera)
- Cesium学习笔记(一)添加实体
- Cesium学习笔记(二)Imagery Provider
- Cesium学习笔记(三)地形
- Cesium学习笔记(四)Camera
- Cesium学习笔记
- Cesium 学习记录(2) 初始化Viewer
- Cesium学习笔记(八):Demo学习(差值器)
- Cesium学习笔记(十):粒子系统(Particle System)
- Cesium学习笔记(一):环境配置和首次运行
- Cesium学习笔记(二):添加实体对象
- Cesium学习笔记(五):3D 模型
- Cesium学习笔记(四)添加3D模型
- Cesium学习笔记(五)几何和外观
- hdu 1853 Cyclic Tour【最小费用最大流】
- HDU1548-A strange lift
- mtk Android 常用编译命令
- Python 错误和异常小结
- 初识《大话设计模式》
- Cesium学习笔记(2)
- CCF 201509-3 我参考别人 100分
- Codeforces 201 A Clear Symmetry
- I2C接口与SPI和UART接口的区别
- 解决VS2010链接错误:LINK : fatal error LNK1123: 转换到 COFF 期间失败: 文件无效或损坏
- SQL基础语句的学习
- java多线程:synchronized
- 【备份专题】备份方案组网架构解析
- JAVA 中BIO,NIO,AIO的理解