Cesium学习笔记

一、Cesium简介

Cesium 是一个JavaScript库用于在Web浏览器创建 3D 地球和 2D 地图，无需任何插件。Cesium 使用 WebGL 来进行硬件加速图形化；跨平台；跨浏览器；实现真正的动态数据进行可视化。Cesium 基于 Apache 开源协议，支持商业和非商业免费使用。该框架不需要任何插件支持，但是浏览器必须支持WebGL。

Cesium 主要特性：

• 动态地理空间可视化

• 非常高的性能和精准度

• 一个 API，三种视图：3D，2D 和 2.5D

Cesiumjs目录结构：

Apps -   Viewer的例子程序

Cesium - 最小化的cesium库js文件

CesiumUnminified - 非最小化的cesium库js文件（用于调试目的）

Documentation - html版的API文档

stubs - （暂时不知道用途）

HelloWorld.html - 最简单的例子

index.html - 起始页面，包含hello world例子和文档入口

minifyShaders.state - （暂时不知道用途）

server.js - 启动一个最简单的http服务器的nodejs脚本，监听在8080端口

如要查看cesium所支持的所有功能，可以设定web服务器的webroot指向根目录下Apps（非Build/Apps）目录，然后在浏览器中进入Sandcastle连接。Sandcastle是一个cesium特性演示环境，同时是可以修改代码即时看到效果的沙箱（sandbox）。

二、获取当前视口范围

function measureExtent(){
    viewer.trackedEntity=null;
    var pt1 = new Cesium.Cartesian2(0,0);
    var pt2= new Cesium.Cartesian2(window.innerWidth,window.innerHeight);
    var pt3= new Cesium.Cartesian2(window.innerWidth/2,window.innerHeight/2);

    var pick1= scene.globe.pick(viewer.camera.getPickRay(pt1), scene);
    var pick2= scene.globe.pick(viewer.camera.getPickRay(pt2), scene);
    var pick3= scene.globe.pick(viewer.camera.getPickRay(pt3), scene);

    //将三维坐标转成地理坐标
    var geoPt1= scene.globe.ellipsoid.cartesianToCartographic(pick1);
    var geoPt2= scene.globe.ellipsoid.cartesianToCartographic(pick2);
    var geoPt3= scene.globe.ellipsoid.cartesianToCartographic(pick3);

    //地理坐标转换为经纬度坐标
    var point1=[geoPt1.longitude / Math.PI * 180,geoPt1.latitude / Math.PI * 180];
    var point2=[geoPt2.longitude / Math.PI * 180,geoPt2.latitude / Math.PI * 180];
    var point3=[geoPt3.longitude / Math.PI * 180,geoPt3.latitude / Math.PI * 180];
    //var Points_lc = [];
    //var polyline_lc = new Cesium.Entity();
    //var length_lc;
    //Points_lc.push({lon: point1[0], lat: point1[1]});
    //Points_lc.push({lon: point3[0], lat: point3[1]});
    //length_lc = computeLength(Points_lc);
    var d = Cesium.Cartesian3.distance(new Cesium.Cartesian3(pick1.x, pick1.y, pick1.z), new Cesium.Cartesian3(pick3.x, pick3.y, pick3.z));
    console.log(point1);
    console.log(point2);
    console.log(point3);
    console.log(d);
}