Cesium


Cesium 是一款面向三维地球和地图的,世界级的JavaScript开源产品。它提供了基于JavaScript语言的开发包,方便用户快速搭建一款零插件的虚拟地球Web应用,并在性能,精度,渲染质量以及多平台,易用性上都有高质量的保证。

效果图

在气象行业,经常会在地图上展示雷达反射率等一些产品图,雷达图有图片格式,也有geojson格式的,每种格式都有加载渲染的方式,在这里,我们介绍的是图片格式的雷达产品。

  • 加载雷达图

加载雷达图可以使用简单的polygon就可以了。

1、设置好图片要显示的范围

  • var positions = [
  • Cesium.Cartesian3.fromDegrees(73.16895, 12.2023),
  • Cesium.Cartesian3.fromDegrees(134.86816, 12.2023),
  • Cesium.Cartesian3.fromDegrees(134.86816, 54.11485),
  • Cesium.Cartesian3.fromDegrees(73.16895, 54.11485)
  • ];

2、添加polygon

  • viewer.entities.add({
  • polygon: {
  • hierarchy: new Cesium.PolygonHierarchy(positions),
  • material: './images/radar.png'
  • }
  • });

简单的两步就加载完成了雷达图。

  • 雷达动图

仅仅显示一张雷达图,往往是不够的,我们要根据雷达动图来判断天气趋势,所以静态的图只能说明某一时间的天气情况,但是不能进行预测。

更多详情见小专栏此文章GIS之家cesium小专栏

文章提供源码,对本专栏感兴趣的话,可以关注一波

Cesium专栏-气象雷达动图(附源码下载)的更多相关文章

  1. Cesium专栏-淹没分析(附源码下载)

    Cesium 是一款面向三维地球和地图的,世界级的JavaScript开源产品.它提供了基于JavaScript语言的开发包,方便用户快速搭建一款零插件的虚拟地球Web应用,并在性能,精度,渲染质量以 ...

  2. Cesium专栏-地形开挖(附源码下载)

    Cesium Cesium 是一款面向三维地球和地图的,世界级的JavaScript开源产品.它提供了基于JavaScript语言的开发包,方便用户快速搭建一款零插件的虚拟地球Web应用,并在性能,精 ...

  3. leaflet 结合 Echarts4 实现迁徙图(附源码下载)

    前言 leaflet 入门开发系列环境知识点了解: leaflet api文档介绍,详细介绍 leaflet 每个类的函数以及属性等等 leaflet 在线例子 leaflet 插件,leaflet ...

  4. leaflet实现风场图(附源码下载)

    前言 leaflet 入门开发系列环境知识点了解: leaflet api文档介绍,详细介绍 leaflet 每个类的函数以及属性等等 leaflet 在线例子 leaflet 插件,leaflet ...

  5. cesium 实现风场图效果(附源码下载)

    前言 cesium 官网的api文档介绍地址cesium官网api,里面详细的介绍 cesium 各个类的介绍,还有就是在线例子:cesium 官网在线例子,这个也是学习 cesium 的好素材. 内 ...

  6. Cesium专栏-雷达遮罩动态扫描(附源码下载)

    Cesium 是一款面向三维地球和地图的,世界级的JavaScript开源产品.它提供了基于JavaScript语言的开发包,方便用户快速搭建一款零插件的虚拟地球Web应用,并在性能,精度,渲染质量以 ...

  7. Cesium专栏-地形开挖2-任意多边形开挖(附源码下载)

    “任意多边形地形开挖” 是“地形开挖”的补充篇,在这节里,我们介绍关于如何使用任意多边形对地形进行开挖,同时,由于有不少小伙伴也咨询了关于“地形开挖”篇后序内容中的填充地形的效果,之前没放出来,是想让 ...

  8. Cesium专栏-填挖方分析(附源码下载)

    Cesium 是一款面向三维地球和地图的,世界级的JavaScript开源产品.它提供了基于JavaScript语言的开发包,方便用户快速搭建一款零插件的虚拟地球Web应用,并在性能,精度,渲染质量以 ...

  9. cesium 圆圈警戒扫描(附源码下载)

    前言 cesium 官网的api文档介绍地址cesium官网api,里面详细的介绍 cesium 各个类的介绍,还有就是在线例子:cesium 官网在线例子,这个也是学习 cesium 的好素材. 内 ...

随机推荐

  1. 原生js复制粘贴上传图片前后台代码,兼容firebox,chrome, ie11,亲测有效

    需求:粘贴上传图片,截图工具,右键粘贴,或者ctrl+v粘贴 方法1:可直接套用富文本框的图片上传功能,完成复制粘贴 缺点:麻烦,样式难控制 方法2:用原生js完成,以下案例基于此,样式请自己动手调整 ...

  2. JS---封装getScroll函数 & 案例:固定导航栏

    封装getScroll函数 1. 获取页面向上或者向左卷曲出去的距离的值 2. 浏览器的滚动事件 function getScroll() { return { left: window.pageXO ...

  3. iOS开发-APP图标、启动页、名字的设置

    APP图标.启动页.名字的设置:(较全面,但是APP启动页讲述的有漏洞) 参考链接:https://www.jianshu.com/p/2c7e181276ff APP启动页:(弥补上一文的漏洞) 参 ...

  4. Android 菜单 Menu

    @Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to th ...

  5. js 从两道面试题加深理解闭包与箭头函数中的this

     壹 ❀ 引 在本文之前我已经花了两个篇幅专门介绍了JavaScript中的闭包与this,正好今早地铁上看到了两道面试题,试着做了下发现挺有意思,所以想单独写一篇文章来记录解析过程.若你对于闭包与t ...

  6. ROS--自定义消息类型

    一.msg 用于发布-订阅的通信方式中. 1.在包的src 中创建msg文件夹. 2.在msg文件夹中,创建.msg文件 3.编辑.msg文件 4.编辑package.xml , 添加依赖 <b ...

  7. Spring Boot2解决idea console 控制台输出乱码

    Idea默认配置是采用GBK, 而项目工程文件采用的是UTF-8. 编码不一致,导致idea Console控制台输出乱码. 网上的解决方案,大都是直接修改Settings=>Editor=&g ...

  8. 基于canvas二次贝塞尔曲线绘制鲜花

    canvas中二次贝塞尔曲线参数说明: cp1x:控制点1横坐标 cp1y:控制点1纵坐标 x: 结束点1横坐标 y:结束点1纵坐标 cp2x:控制点2横坐标 cp2y:控制点2纵坐标 z:结束点2横 ...

  9. LinqDB 查询数据库

    LinqDB数据库查询数据,还是很方便的. 1. 添加Entity数据实体类 方便之后映射操作 /// <summary> /// 课件 /// </summary> [Dat ...

  10. Spring(4)AOP

    Spring(4)AOP 1.AOP概述 在软件业,AOP为Aspect Oriented Programming的缩写,意为:面向切面编程,通过预编译方式和运行期动态代理实现程序功能的统一维护的一种 ...