1.cesium简介和环境搭建

已于 2022-12-19 17:27:59 修改
阅读量4.2k 收藏 10
点赞数
分类专栏： Cesium 文章标签： javascript
于 2022-12-19 16:16:47 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44552168/article/details/128373489
版权

目录

一、cesium介绍

cesium是什么？

cesium能做什么？

cesium的限制？

cesium的好处是什么？

二、创建一个简单的cesium

安装node环境

下载cesiumSDK

部署cesium

三、补充说明

Documentation

Sandcastle

一、cesium介绍

cesium是什么？

      cesium是一个可以跨平台和浏览器展示三维地球、地图的JavaScript库。

cesium能做什么？

  1. 支持2D、2.5D、3D形式的地图展示
  2. 可以绘制各种几何图形、支持导入图片甚至3D建模等多种数据，用于实现数据可视化展示
  3. 可用于动态数据可视化并提供交互，且兼容大多数的浏览器
  4. 可以基于时间轴动态展示数据

cesium的限制？

      cesium是通过WebGL进行硬件加速图形，所以浏览器必须支持WebGL

cesium的好处是什么？

        cesium是基于Apache2.0的开源程序，它可以免费商用

二、创建一个简单的cesium

安装node环境

node下载地址，具体安装方式请自行百度，安装后在cmd窗口输入 node -v 命令出现node.js的版本号就说明安装成功了

下载cesiumSDK

1.npm下载

$ npm install cesium

2.百度云盘下载 

链接：https://pan.baidu.com/s/1jmcHiRDtRi37ifcDGCGDaw?pwd=8q9k 
提取码：8q9k 

 npm下载慢可以换成淘宝镜像，还是慢的话就云盘。

部署cesium

将下载下来的文件放在tomcat的webapps目录下然后启动tomcat

双击startup

出现 说明启动成功，然后在浏览器访问 http://localhost:8080/Cesium-1.88/出现下图页面说明部署成功了

部署的方法有很多中比如node安装视频、http-server 等等...

三、补充说明

在http://localhost:8080/Cesium-1.88/页面中Documentation(API文档)和Sandcastle(示例)非常重要

Documentation

        是一个完整的CesiunmAPI说明，在里面可以找到模块的函数、属性、效果截图、代码示例

Sandcastle

        一个沙盒可以浏览当前版本的功能特性，也是一个可运行的代码库

my陈
关注
  • 0
    点赞
  • 踩
  • 10
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
cesium环境配置说明.docx
05-23
基于cesium开发基础环境配置与搭建，描述过程简洁易懂，希望能帮助有需要的人，欢迎下载。
Cesium1.7教程.pdf
03-23
根据官网最新文档整理，每个细节一清二楚，如cesium基础知识讲解，包含 开发环境搭建、cesium基础知识、数据处理及服务发布 ，各种效果的实现等讲解。，免去了您查英文文档的麻烦。内附各种实例，包括效果图和源码，物有所值。
Cesium笔记 获取当前视角的坐标以及偏航角等信息
最新发布
qq_40216244的博客
03-26 158
【代码】Cesium笔记 获取当前视角的坐标以及偏航角等信息。
Cesium+Vue3+vite环境搭建好的的源码
02-27
Cesium+Vue3+vite环境搭建好的的源码，方便小白快速开始学习
Cesium入门01-环境构建
01-08
简述Windows的Cesium环境搭建流程以及操作可能遇到的问题 一、安装过程 tip：由于官网下载速度感人，下面网盘链接里提供了从官网下载的NodeJS(v12.16.0)和Cesium(v1.40) 链接：https://pan.baidu.com/s/16Vykoplg1VRJ_WUpwL2L0w 提取码：kgij 1.下载并安装NodeJS（官网：https://nodejs.org/en/download/） 下载完安装包，直接走安装流程 验证过程（在cmd中键入 node -v）：若返回版本号，即为安装完成 2.下载Cesium (官网：https://cesium.com
WebGL可视化地球和地图引擎：Cesium.js
GIS笔记
07-23 3万+
Cesium介绍Cesium是国外一个基于JavaScript编写的使用WebGL的地图引擎。Cesium支持3D,2D,2.5D形式的地图展示，可以自行绘制图形，高亮区域，并提供良好的触摸支持，且支持绝大多数的浏览器和mobile。无需任何插件。Cesium 使用 WebGL 来进行硬件加速图形化；跨平台；跨浏览器；实现真正的动态数据进行可视化。Cesium 基于 Apache 开源协议，支持
【Cesium 编程第一篇】概述、环境搭建、界面介绍
前端知识分享喵
04-09 7989
Cesium 是一个跨平台、跨浏览器的展示三维地球和地图的 javascript 库。Cesium 使用 WebGL 来进行硬件加速图形，使用时不需要任何插件支持，但是浏览器必须支持WebG
Cesium简介
floating_heart的博客
06-26 3万+
Cesium框架简介，尚未全部完成
cesium简介
danshiming的博客
07-25 7474
cesium简介
cesium入门简介
qq_40098572的博客
02-17 4401
简介：Cesium是国外一个基于JavaScript编写的使用WebGL的地图引擎。Cesium支持3D,2D,2.5D形式的地图展示，可以自行绘制图形，高亮区域，并提供良好的触摸支持，且支持绝大多数的浏览器和mobile。 主要功能： 1.使用3d tiles格式流式加载各种不同的3d数据，包含倾斜摄影模型、三维建筑物、CAD和BIM的外部和内部，点云数据。并支持样式配置和用户交互操作。 2.全球高精度地形数据可视化，支持地形夸张效果、以及可编程实现的等高线和坡度分析效果。 3.支持多种资源的图像
Cesium 简介
镜花水月
11-18 4855
Cesium 是一个开源 JavaScript 库，用于 3D , 2D , 2.5D 地图可视化
Cesium.HPUZYZ.Demo:该项目是CESIUM的一些演示。 其中许多来自其他人的博客和铯的官方网站（https
05-24
该工程整个包大小500M左右，下载...目前我把cesium学习基础内容整理19个笔记，涵盖环境搭建、影像服务、地形服务、模型加载、鼠标事件、绘制对象、3DTiles加载等几方面。关于其它诸如czml、DataSource、粒子系统等先放
Cesium是什么
热门推荐
跃然实验室
08-19 7万+
Cesium是什么 Cesium 是一款面向三维地球和地图的，世界级的JavaScript开源产品。它提供了基于JavaScript语言的开发包，方便用户快速搭建一款零插件的虚拟地球Web应用，并在性能，精度，渲染质量以及多平台，易用性上都有高质量的保证。  通过Cesium提供的JS API，可以实现以下功能： 全球级别的高精度的地形和影像服务 矢量以及模型数据 基于时态的数据可视...
cesium编程入门 (一) cesium简介
wish_way的博客
04-28 4702
cesium是什么 Cesium是一个跨平台、跨刘览器的展示三维地球和地图的javascript库. Cesium使用webGL来进行硬件加速图形,使用时不需要任何插件支持,但是浏览器必须支持WebGL; Cesium是基于Apache2.0许可的开源程序,它可以免费的用于商业和非商业用途。 cesium官方网站：https://cesium.com/platform/cesiumjs/ cesium能做什么 支持20D,25D,3D形式的地图局示, 可以绘制各种几何图形、高亮区域,支持导入图片
Cesium简介及发展历史
纸飞机的旅行的博客
02-20 7099
Cesium简介及发展历史
1.Cesium介绍及环境配置
极限突破者的博客
07-11 1万+
本文中我们介绍了cesium开发环境的配置，以及vue中cesium页面的初始化
Cesium基础教程
IT飞牛
04-20 1万+
Cesium是国外一个基于javascript的地图引擎，支持3D、2D、2.5D形式的展示，可以自行绘制图形、高亮区域，并提供良好的触摸支持，并支持大多数的浏览器和移动端。
Cesium 入门
虎康的博客
06-23 2397
Viewer：主要窗口Cesium 展示三维要素内容的主要窗口，包含三维地球的视窗，还包含了一些基础控价const viewer = new Cesium.Viewer('div的ID',{ options可选参数 }，包括图层)options可选参数animation: false, 隐藏动画效果timeline:false, 隐藏时间轴等等Scene：场景类，隐藏地球图层Entity：实体类。
cesium + vue2环境搭建
09-03
Cesium是一个用于创建三维地球和地球数据可视化的开源JavaScript库。Vue是一个用于构建用户界面的渐进式JavaScript框架。在搭建Cesium和Vue2环境之前，确保你已经在电脑上安装好了Node.js和npm。 首先，我们需要创建一个新的Vue项目。打开终端或命令提示符，输入以下命令来创建一个新的Vue项目： ``` vue create cesium-vue-demo ``` 接下来，选择手动配置，然后按照默认设置一步一步进行配置。当配置工具询问你是否要选择预设配置或手动选择特性时，请选择手动选择。 然后，在第一项核心功能中选择了Babel、Router和Vuex，第二项选中了CSS Pre-processors，第三项不选择Linter/Formatter。 完成配置后，进入项目目录： ``` cd cesium-vue-demo ``` 然后，我们需要安装Cesium依赖。在终端中输入以下命令： ``` npm install cesium --save ``` 安装完成后，我们需要修改webpack配置，以便正确加载Cesium依赖。打开`vue.config.js`文件，输入以下内容： ```javascript module.exports = { // ... configureWebpack: { output: { // 修改打包后静态文件的路径 publicPath: './' }, amd: { // 添加一个module文件的对外映射关系 toUrlUndefined: true }, // 解决加载Cesium的路径问题 resolve: { alias: { cesium: path.resolve(__dirname, 'node_modules/cesium/Source') } }, // 设置全局变量 plugins: [ new webpack.DefinePlugin({ CESIUM_BASE_URL: JSON.stringify('./') }) ] }, // ... } ``` 然后，我们需要在Vue组件中引入Cesium。在`App.vue`文件中添加以下代码： ```javascript <template> <div id="cesiumContainer"></div> </template> <script> import * as Cesium from 'cesium' export default { mounted() { const viewer = new Cesium.Viewer('cesiumContainer') // 添加Cesium代码 } } </script> ``` 最后，运行以下命令启动Vue项目： ``` npm run serve ``` 现在，你已经成功搭建了一个Cesium和Vue2的环境。你可以在`App.vue`中添加Cesium代码来创建三维地球和地球数据可视化应用。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值