废话不多说,今天就先在Eclipse上搭建Cesium开发环境吧~

零、Cesium简介

Cesiumjs 是一套javascript库,用来渲染3D地球,2D区域地图,和多种GIS要素。不需要安装任何插件就能在支持最新HTML5标准的浏览器上运行。支持WebGL硬件加速,非常适合动态数据在GIS图层上的展示,是一个跨平台,开源,非常有前途的webgis表现层库。

Cesiumjs源自 Analytical Graphics, Inc. (AGI) 公司为他们客户开发一个虚拟地球项目,后来将cesium项目贡献给开源社区并一直活跃开发中。(AGI 开发的 STK Terrain Server 是一种针对Cesium-应用的流式高分辨率服务器)另一个公司级的贡献者是NICTA (National ICT Australia) 澳大利亚最大的信息与通讯技术中心,NICTA的员工们贡献了瓦片地图服务、地形处理等cesium的核心功能。并一直使用cesium开发环境监测分析、交通基础设施建模仿真优化等领域的应用。

此前我对比了一些GIS开源框架,相对来说Cesium是比较适合web gis的,只要浏览器支持webgl就可以无需下载任何插件运行,目前大多数主流浏览器都支持webgl,包括很多手机自带的浏览器也逐渐开始支持webgl,因此webgl的普及也必定是大势所趋。

一、开发环境
  1、系统:windows 7/8/10均可
  2、jdk:1.8.0_144

  3、服务器:apache-tomcat-9.0.8

  4、cesium:Cesium-1.54
  5、IDE:eclipse+jsp

  【新手请自行搜索jdk的下载及配置、Tomcat的下载及配置,eclipse的下载及配置~】

二、代码测试

1、首先,我们需要从Cesium的官网下载最新的包:

  Cesium的官方网站:https://cesiumjs.org/,点击这个按钮来获取最新的Cesium:下载Cesium。Github站点为:https://github.com/AnalyticalGraphicsInc/cesium.git但是速度太慢了。

2、接下来,使用Eclipse建立一个新的Dynamic Web Project项目,如下图 所示:

  在“Project Name”中输入“CesiumStudy”。

3、将Cesium包解压,解压缩后的目录如下图所示:

4、将解压缩后的Build文件夹下面的Cesium子目录复制到项目的目录下,如下图所示:

         =====〉

5、在项目CesiumStudy上右键单击,添加Html File,在“File Name”中输入index.html,如下图所示:

之后在index.html文件中输入以下的测试代码:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!-- Tell IE to use the latest, best version. -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- Make the application on mobile take up the full browser screen and disable user scaling. -->
<meta name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<title>Hello World!</title>
<script src="./Cesium/Cesium.js"></script>
<style>
@import url(./Cesium/Widgets/widgets.css); html, body, #cesiumContainer {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow: hidden;
}
</style>
</head>
<body>
<div id="cesiumContainer"></div>
<script>
var viewer = new Cesium.Viewer('cesiumContainer');
</script>
</body>
</html>

注意代码中蓝色加粗处的路径设置。

6、启动server,查看页面的运行效果图,操作如下所示:

  apache-tomcat-9.0.8服务器start以后,也可以使用任意一款浏览器,输入网址访问测试网页:

  http://localhost:8888/CesiumStudy/index.html(8888位端口号,每台计算机在用的端口号可能不一样,根据实际情况调整)。效果如下图所示:

7、此外,也可以将该Web项目部署到webapps文件夹下,即在默认安装目录的webapps(即C:\Program Files\apache-tomcat-9.0.8\webapps)下新建目录“CesiumStudy”,再将CesiumStudy项目的webContent目录下的Cesium文件夹和index.html文件复制到新建的CesiumStudy目录下,如下图所示:

  之后运行C:\Program Files\apache-tomcat-9.0.8\bin\startup.bat来启动apache-tomcat-9.0.8服务器。服务器启动成功后,在浏览器中输入如下地址:

  http://localhost:8080/CesiumStudy/cesium/Apps/HelloWorld.html

  我们就可以运行基于开源Cesium的测试页面啦,并且在右上角可以切换各种地图。效果如下图所示:

  这样一来,Cesium的基本开发环境就搭建好了。

  如果我们想要隐藏下方的版权信息,在下面这句代码

 var viewer = new Cesium.Viewer('cesiumContainer'); 

  后面加上下面这句代码就可以实现啦!

  viewer._cesiumWidget._creditContainer.style.display="none";  

  去掉版权信息后如下图,看起来清爽了许多!!!

Cesium学习2:如何从零开始在Eclipse IDE,Java语言搭建cesium开发环境的更多相关文章

  1. Eclipse+ADT+Android SDK 搭建安卓开发环境

    Eclipse+ADT+Android SDK 搭建安卓开发环境   要求 必备知识 windows 7 基本操作. 运行环境 windows 7(64位); eclipse-jee-luna-SR2 ...

  2. Eclipse+ADT+Android SDK 搭建安卓开发环境(版权属于forever-z)

    运行环境 windows 7或者10(64位); 为例eclipse-jee-neon-3-win32-x86_64: ADT-23.0.4 下载地址 安装JDK 这里可以参考关于安装JDK的教程,请 ...

  3. Eclipse+ADT+Android SDK 搭建安卓开发环境(转)

    要求 必备知识 windows 7 基本操作. 运行环境 windows 7(64位); eclipse-jee-luna-SR2-win32(32位);ADT-23.0.4 下载地址 环境下载 最近 ...

  4. 在Eclipse平台中,搭建SpringBoot开发环境

    1.查看eclipse版本号,Help->About Eclipse IDE 2.下载对应版本的STS插件 下载地址:https://spring.io/tools3/sts/all(注意版本对 ...

  5. Hadoop学习之路(八)在eclispe上搭建Hadoop开发环境

    一.添加插件 将hadoop-eclipse-plugin-2.7.5.jar放入eclipse的plugins文件夹中 二.在Windows上安装Hadoop2.7.5 版本最好与Linux集群中的 ...

  6. Eclipse+ADT+Android SDK搭建安卓开发环境

    第一步:打开[Android.rar]压缩包,如图所示[评论区回复我,压缩包地址] 第二步:配置环境变量 (1) 解压[android-sdk_r24.4.1-windows.zip]压缩包 (2)  ...

  7. ios学习笔记(一)Windows7上使用VMWare搭建iPhone开发环境(转)

    原文地址:http://blog.csdn.net/shangyuan21/article/details/18153605 我们都知道开发iPhone等ios平台的移动应用时需要使用Mac本,但是M ...

  8. java 学习笔记1 java语言概述及开发环境

    高级语言运行机制 高级语言按程序的执行方式分为编译型和解释型两种. java语言比较特殊,Java程序的执行必须经过先编译后解释的步骤. 1 编译生成字节码,只面向JVM(.class) 2Jvm执行 ...

  9. 【分享】01. Eclipse for PHP + phpStudy 搭建php开发环境

    配置php编译器 配置phpStudy服务器项目发布目录 修改hosts文件127.0.0.1      www.350zx.cn 新建项目 启动的你的phpStudy  

随机推荐

  1. eclipse使用struts2找不到action方法或找不到action的错误记录

    在确认web.xml已经配置, 配置好struts.xml , 代码没有报错, jar包没有问题, 服务器也没有问题, 代码逻辑没有问题, 关键字方法名action都没有写错, 可以运行旧的相同的代码 ...

  2. matlab的解方程的例子

    syms x y z=exp(2*x+y)+cos(3*x*y)-exp(1)-1; zz=subs(z,x,1) solve(zz)

  3. javascript基础知识学习

    javascript中几种基础函数的介绍 1.typeof 注意: ① typeof 是操作符,不是函数: ② typeof 操作符 接收一个参数,用来判断参数数据类型,存在六种返回值类型,非别是:u ...

  4. canvas-0translate.html

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. 1788:Pell数列

    1788:Pell数列 查看 提交 统计 提问 总时间限制:  3000ms 内存限制:  65536kB 描述 Pell数列a1, a2, a3, ...的定义是这样的,a1 = 1, a2 = 2 ...

  6. 七牛云java(服务端)通用工具类

    前言 需要安装lombok插件. 功能列表 上传本地文件 上传Base64图片 获取文件访问地址 上传MultipartFile 代码 pom.xml <dependency> <g ...

  7. video自动禁止全屏

    在微信浏览器.苹果等其他浏览器,里面使用video标签,会自动变成全屏,改成下面就好了,起码可以在video标签之上加入其他元素    webkit-playsinline playsinline x ...

  8. TortoiseSVN 1.9.5安装 与 Eclipse4.4.2及以上版本中安装SVN插件

    引自: http://blog.csdn.net/chenchunlin526/article/details/54631458 TortoiseSVN 1.9.5安装 与 Eclipse4.4.2及 ...

  9. CSS字体超出两行省略

    text-overflow: -o-ellipsis-lastline;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-w ...

  10. Autoit3操作网页实现自动化

    Autoit3 本身有内置的用户自定义函数IE.au3,只限于IE浏览器,如果是Firefox浏览器需要另外自定义函数. 找了很多资料发现有个FF.au3的自定义函数,下载地址 http://www. ...