Cesium安装以及环境配置
浏览器支持
首先，检查一下你的浏览器是否支持WebGL。 目前，大多数平台和浏览器都支持WebGL，在这些环境下运行Cesium并没有太大的问题，但效果和性能是否能够满足不同的需求，就需要考虑很多细节和额外因素。
大多数平台和浏览器都支持WebGL1.0标准，也就是OpenGL ES2.0规范。2017年年初，Chrome新版本低调的支持WebGL2.0，随着各硬件厂商GPU性能的提升和WebGL2.0规范的成熟，WebGL技术会有更大的提升潜力。 首先，无论是PC还是移动端，Chrome是WebGL开发和应用的最佳平台，所以，如果没有特殊的硬性要求，建议大家使用Chrome学习和开发Cesium。
通过浏览器访问WebGL Report网站，获取浏览器对WebGL的支持清单。如上图，红线是最关心的几个属性：
是否支持WebGL标准
是否支持ANGLE 扩展： Chrome通过该扩展，在Windows平台下将OpenGL接口转为D3D，不仅提升了性能，而且还可以支持实例化这一重要特性
是否支持深度纹理： 拾取等功能依赖于深度技术
顶点着色器的最大属性数： 一个功能自从诞生之初，就开始趋于复杂，所以我们还要清楚它的极限，合理控制产品的复杂度。
目前IE11对WebGL支持的还可以，但不支持深度纹理，需要升级到Edge；在移动平台，Cesium的地球调度比较消耗资源，目前的硬件能力并不太适合，比如内存崩溃，机器发烫。思路是在移动端仅支持平面场景，只是一个局部坐标，节约地球调度的性能消耗。
浏览器选择
Cesium是建立在几种新的HTML5技术上的，其中最重要的是WebGL。尽管这些新标准很快被广泛采用，但一些浏览器和系统需要更新以支持它们。如果示例应用程序不适合您，这里有一些需要尝试的东西。
- 更新您的web浏览器。大多数Cesium团队使用谷歌Chrome，但火狐、Internet Explorer 11和Opera也将工作。如果您已经使用了上述浏览器中的一个，请确保它已更新到最新版本。
- 更新你的显卡驱动，以更好地支持3D。如果你知道你有什么类型的视频卡，你可以检查供应商网站进行更新。最受欢迎的三个是:Nvidia, AMD, 和 Intel。
- 如果您仍然有问题，请尝试访问http://get.webgl.org/，它提供了额外的解决问题的建议。你也可以在Cesium forum（论坛）上寻求帮助。
选择编辑器或IDE
- 如果您已经是一个经验丰富的开发人员，那么您很可能拥有一个最喜欢的编辑器或开发环境;例如，大多数铯团队都使用Eclipse、Idea。如果你刚刚开始，一个很棒的免费和开源的编辑器是Notepad++，你可以从their website下载。最终，所有的文本编辑器都会这样做，所以你可以选择你最喜欢的那个。
设置web服务器以及安装
Cesium的Node js安装方法
为了运行Cesium程序, 我们需要一个本地web服务器来承载我们的文件。我们将使用node.js和其它的教程。 如果您已经有了您想要使用的web服务器，那也可以，只要确保我们在上一节中创建的根目录就可以了。Cesium没有服务器要求;它完全是客户端。这意味着任何能够承载静态内容的web服务器也可以承载Cesium。
下载CesiumJS安装文件。
设置一个node.js的服务很简单，只要下面三步：
1.初始化Node.js，使用其默认的初始化配置。
2.在Cesium根目录中打开一个命令shell，并通过执行 npm install来安装来下载/安装所需的模块。这将在根目录中创建一个“node_modules”目录。 也可以通过npm install cesium来一步安装。
4.最后，通过执行 在根目录下的node server.js启动web服务器。
你应该看到如下的结果。
现在,我们已经创建了一个web服务器启动并运行,我们可以启动一个浏览器,并打开http://localhost:8080/Apps/HelloWorld.html。这是我们在本教程开始时用来测试WebGL的Hello World应用程序。
Python方式
1.假设已经安装好Python，如使用的是Anaconda 5.1，Python版本是3.6的。
2.通过开始菜单打开Anaconda Prompt控制台程序，并进入到Cesium的安装目录,然后输入：python -m http.server 9090，即可打开Web服务，见下图（其中9090为端口号，可自行设置，只要不与其他端口冲突就行了）
在浏览器地址栏中输入：http://localhost:9090/ ，即可访问Cesium的主文件 
使用Tomcat架设Cesium本地服务器
我们将Cesium部署在本地服务器上主要有以下方面的考虑：
1.局域网内，创建Web服务，通过对Cesium服务端文件的修改，展示我们自己想要提供的功能，从而可以在局域网内任何一台机器上通过浏览器即可访问。
2.将测试修改后的Cesium文件部署到云主机中自己的网站上，实现个人网站的发布。
下载
去Tomcat官网下载，下载的apache-tomcat-9.0.7。注意，下载.zip文件为免安装版本。放在合适位置，直接解压缩即可，放在 D:\apache-tomcat-9.0.7。
环境变量配置
配置系统的环境变量（右键计算机-属性-高级系统设置-环境变量-新建系统变量）
变量名：CATALINA_HOME，变量值为安装目录” D:\apache-tomcat-9.0.7”，根据你自己安装的目录进行对应修改。
由于tomcat依赖于JAVA的运行环境，因此应确保JRE的安装，我安装的JDK版本是1.8，同样查看JRE的环境变量是否配置正确，确保JRE_HOME指向正确的位置。
有关Java运行环境JDK的安装，请参考：
https://blog.csdn.net/u011575168/article/details/79920107。
启动服务
进入到Tomcat安装目录的bin目录下，找到startup.bat文件，双击运行，即可看到以下界面，注意，在tomcat提供web服务期间，不要关闭此窗口。 
然后打开浏览器，在里面输入http://localhost:8080/ 就可以看到如下界面
到此Tomcat就搭建好了,web服务即开启。
关闭服务
直接关闭命令行窗口时，Tomcat就停止了。
修改端口号
tomcat提供web服务默认的端口号是8080，如果想要修改端口号，则进入Tomcat安装目录下的conf目录，打开server.xml，修改以下代码中的port值，然后重启tomcat即可。
<Connector port="8080" protocol="HTTP/1.1"
connectionTimeout="20000"
redirectPort="8443" />
注意，如果是建立个人网站，则端口号设置为80。
tomcat报warinig Unable to add the resource at [..] to the cache..
信息大致的意思就是不能给资源加cache了，因为没有足够的可用空间了。
原来 tomcat8中增加了静态资源缓存的配置
以下是两个相关参数说明：
cacheMaxSize：静态资源缓存最大值，以KB为单位，默认值为10240KB
cachingAllowed：是否允许静态资源缓存，默认为true
解决方法：
增大缓存 在 conf/context.xml中加入：
<Resources cachingAllowed="true" cacheMaxSize="102400"/>
修改tomcat默认主页
前面介绍开启tomcat服务时，默认登录的页面是tomcat的，那么如何修改TOMCAT的默认主页为你自己项目的主页呢？
最简单的办法是删除Tomcat目录下的\webapps\ROOT文件夹下所有文件，然后将自己主页的文件全部放在Root文件夹下面。
同时删除文件夹\work\Catalina内的所有文件即可。
Cesium的配置
下载Cesium(2018年4月的版本是1.44)，将其解压缩在Tomcat目录下的Webapps文件夹内，Cesium文件夹结构如下(为了方便可以将文件夹名称Cesium-1. .44改为Cesium)：
其中，文件夹lyf是我自己创建的。
注意，下载的压缩包文件是放在服务器端的，index.html就是通过浏览器访问tomcat服务器上的Cesium的主页面，不能直接双击打开，必须通过浏览器访问才能打开。
浏览器访问Cesium及调试
确保你的浏览器支持WebGl，现在最新的浏览器如Chrome/Edge都支持的。
确保tomcat的服务打开，在浏览器地址栏输入http://localhost:8080/Cesium-1.44/即可打开:
注意，上图中，Lyf.HelloWord是我通过修改index.html内容增加的，见下代码处：
建议在本地机器利用Cesium开发的简单流程如下：
1.在Cesium-1.44文件夹内创建自己的个人文件夹（我的是lyf），以后自己所有开发的所有网页(html,img,css)都放在这个文件夹中。
2.拷贝Cesium-1.44/Apps/HelloWorld.html文件到个人文件下，并修改名称（如LyfHelloWorld.html），以便区别。
3.在Cesium主文件index.html中，创建连接指向个人文件夹中的html文件，如LyfHelloWorld.html。
4.利用各种网页编辑器(Eclipse,Visual Studio Code,PyCharm等）直接修改LyfHelloWorld.html，或者创建其他的网页。
5.然后浏览器刷新主页http://localhost:8080/Cesium-1.44/，点击指向所要测试的连接即可查看修改后的效果。
一个例子
例如，我想将下面的图片加载到3D地球上
则将图片WhiteOnBlue.bmp放在lyf文件夹下的imag文件夹内，然后修改lyfHelloworld.html中代码如下：
<body> <div id="cesiumContainer"></div> <script>
var viewer = new Cesium.Viewer('cesiumContainer', {
baseLayerPicker: false});
layers.addImageryProvider(new Cesium.SingleTileImageryProvider({
url : 'imag/WhiteOnBlue.bmp',
rectangle : Cesium.Rectangle.fromDegrees(-180.0, -90.0, 180.0, 90.0)
}));
</script> </body>
保存后，重新加载http://localhost:8080/Cesium-1.44/，点击lyf.HelloWord，即可打开我自己修改后的页面(后面修改html代码后，可直接更新此页面)：
准备你的页面
在开始写代码之前，你需要完成以下几个步骤来准备你的页面,在官方网站下载Cesium包 ，拷贝里面的/Build/Cesium目录到自己的网站中(例如下面示例的lib/Cesium)：
- 在页面的head标签中添加以下代码来引入CSS和JavaScript文件：
<link href="http://cesium.marsgis.cn/lib/Cesium/Widgets/widgets.css" rel="stylesheet" type="text/css" />
<script src="http://cesium.marsgis.cn/lib/Cesium/Cesium.js" type="text/javascript" ></script>
- 将id为cesiumContainer的div标签放到地图显示的地方，如body中：
<div id="cesiumContainer"></div>
- 【可选】确保地图容器有定义好的高度，例如在css文件中添加如下代码：
html, body, #cesiumContainer {height: 100%;width: 100%;margin: 0;padding: 0;overflow: hidden;}
设置三维地球
窗体顶端
窗体底端
让我们创建一个使用本地瓦片地图的三维地图。首先，我们初始化地图，并添加底图图层：
var url = "http://www.google.cn/maps/vt?lyrs=s&x={x}&y={y}&z={z}";
viewer = new Cesium.Viewer("cesiumContainer", {
animation: false, //是否创建动画小器件，左下角仪表
timeline: false, //是否显示时间线控件
fullscreenButton: false, //右下角全屏按钮
geocoder: false, //是否显示地名查找控件
baseLayerPicker: false, //是否显示图层选择控件
imageryProvider: new Cesium.UrlTemplateImageryProvider({url:url})});
//去cesium logo水印
viewer.cesiumWidget.creditContainer.style.display = "none";
现在你已经学会使用Cesium创建一个三维地图应用。如果想要继续开发更多功能，请查看详细的API文档和示例。
2398
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
