一种基于气象数据解析和渲染的综合展示系统技术方案

本发明专利技术提供一种基于气象数据解析和渲染的综合展示系统，属于气象数据技术领域，该基于气象数据解析和渲染的综合展示系统包括服务器端和浏览器端，服务器端定时获取最新风场数据并将其转换成png文件提供给浏览器端前端渲染展示调用，旨在解决现有技术中的以下问题：1、数据不能定时更新操作，未设置定时任务执行数据更新操作；2、气象数据用于web间传输的数据文件为json，对于该数据来讲，json文件过大，会加大网络传输的压力；3、气象数据展示大部分只用单一的颜色渲染来标识风场数据的大小，对于专业人士来说，更倾向于看风矢。更倾向于看风矢。更倾向于看风矢。

【技术实现步骤摘要】
一种基于气象数据解析和渲染的综合展示系统


[0001]本专利技术属于气象数据
，具体涉及一种基于气象数据解析和渲染的综合展示系统。

技术介绍

[0002]目前，气象数据用于web间传输的数据文件为json、对于该数据来讲，json文件过大，会加大网络传输的压力，且目前大部分技术未设置定时任务获取处理气象数据，而气象数据需要设置每天多次更新之后才可以有效保证数据的实时性和可用性；同时目前气象数据展示大部分只用单一的颜色渲染来标识风场数据的大小，对于专业人士来说，更倾向于看风矢。

技术实现思路

[0003]本专利技术的目的在于提供一种基于气象数据解析和渲染的综合展示系统，旨在解决现有技术中的以下问题：1、数据不能定时更新操作，未设置定时任务执行数据更新操作；2、气象数据用于web间传输的数据文件为json，对于该数据来讲，json文件过大，会加大网络传输的压力；3、气象数据展示大部分只用单一的颜色渲染来标识风场数据的大小，对于专业人士来说，更倾向于看风矢。
[0004]为实现上述目的，本专利技术提供如下技术方案：一种基于气象数据解析和渲染的综合展示系统，包括服务器端和浏览器端，所述服务器端定时获取最新风场数据并将其转换成png文件提供给浏览器端前端渲染展示调用，具体包括以下步骤：步骤S1、数据下载：服务器端设置定时任务执行数据下载脚本，定时下载所需数据，所述数据下载脚本中包括以下步骤：步骤S11、时间获取：获取当前时间，确定分辨率及数据范围来组织下载链接；步骤S12、grib数据下载：服务器端通过下载链接分别下载u、v方向的grib数据；步骤S2、数据处理：服务器端对下载的数据进行处理，所述数据处理包括以下步骤：步骤S21、数据简化：调用ecCodes抽取简化处理grib数据文件的byte数据，得到分散的u、v单量的中间数据文件；步骤S22、数据合并：合并u、v方向上两个grib数据到一个json文件中；步骤S23、转成png：脚本调用js文件处理json生成png，png文件按照日期命名，由于每次都会生成未来七天的数据，所以使用当前新生成的png替换之前的预测数据使数据始终保持实时性，其中所述转成png包括以下步骤：步骤S231、u、v数据数值获取：获取u、v数据中的最大值最小值；步骤S232、png数值生成：png中每个像素值都存放对应数值，通过计算u、v数据中的最大值最小值与当前像素中u、v数据的比例对每个png像素值计算，从而生成png文件供
浏览器端调用；步骤S3、图层生成：浏览器端基于leaflet框架渲染风场数据，生成leaflet图层，所述图层生成包括以下步骤：步骤S31、请求数据：浏览器端获取生成的png数据；步骤S32、解析数据：浏览器端按照数据生成的规则反向解析数据；步骤S33、渲染图层：获取当前屏幕显示范围，根据显示范围选取对应所有png像素值数据，进而计算出风速及风向数据；颜色渲染：浏览器端调用双线性插值法插值出当前屏幕范围内的数据，每个数据按照色带区间渲染图层，不同数值使用不同颜色表示，进而生成渲染图层；数值渲染：获取当前地图缩放级别与显示范围，计算每个数值相隔距离，在canvas上绘制对应风速值；风矢渲染：获取当前地图缩放级别与显示范围，计算每个风矢相隔距离，再获取不同级别的风矢图标，根据风向旋转风矢图标，并通过canvas依次绘制不同位置风矢信息；粒子渲染：随机新建粒子，获取每个粒子的风速风向，变换下一时刻，将上个时刻粒子透明度降低，计算出当前时刻粒子所在位置，绘制成线，粒子生命周期变小，当粒子生命周期结束时，再生成新粒子，不断重复，进而渲染出粒子场；步骤S4、查询数据：点击地图上某一点，根据经纬度计算出其对应png文件上的具体像素值，根据像素值R、G通道的数据计算出对应的u、v值，进而计算出该点的风速；步骤S5、结束渲染：数据与渲染结果比对完成后，确定渲染效果，完成渲染效果展示。
[0005]作为本专利技术一种优选的方案，在步骤S12中，所述grib数据中的u表示经度方向上的风，v表示纬度方向上的风；（a）当u为正，表示西风；（b）当v为正，表示南风。
[0006]作为本专利技术一种优选的方案，所述grib数据根据公式var dir=180+Math.atan2(u,v)*180/Math.PI进行计算风向，所述grib数据根据公式var speed=Math.sqrt(u*u+v*v)进行计算风速。
[0007]作为本专利技术一种优选的方案，所述grib数据下载获得的文件为grib2格式，所述grib2格式为一种特殊的二进制格式编码，安装ecCodes使用其命令grib_dump将数据转化成json。
[0008]作为本专利技术一种优选的方案，所述在步骤S232中，所述png数值生成的方式为：U方向上的数值对应R通道、V方向数值对应G通道，RGB中每个通道的参数都在0到255的范围内，使用每个方向上的当前值减去最小值与最大值减去最小值的比乘以255取整等比例获取当前数值上RG通道的数值。
[0009]作为本专利技术一种优选的方案，在步骤S33中，所述浏览器端获取插值数据后，浏览器端根据当前地图缩放级别及显示范围不同，生成风矢与表示风速大小的数值两个图层展示风场信息。
[0010]作为本专利技术一种优选的方案，在步骤S33中，所述浏览器端获取插值数据后，浏览器端生成粒子图层表示风的流动方向，粒子的长度代表风速大小。
[0011]作为本专利技术一种优选的方案，所述基于气象数据解析和渲染的综合展示系统应用于海洋、城市应急、农业、渔业、防灾减灾领域。
[0012]与现有技术相比，本专利技术的有益效果是：1、本专利技术中，客户端是基于leaflet框架渲染风场数据，生成leaflet图层，获取对应时刻的png数据，解析得到规则的网格数据，根据双线性插值法插值获取细致的数据，设置色带，基于该数据渲染图层，根据风速大小的差异选择色带的不同颜色表示，并且可以设置该图层的透明度与地图数据叠加，更加清晰的显示风速大小情况。
[0013]2、本专利技术中，下载获得的文件为grib2格式，grib2格式为一种特殊的二进制格式编码，安装ecCodes使用其命令grib_dump将数据转化成json，转化成的json文件大，将其转化成png能有效压缩文件大小以及保密传输数据。U对应R通道、V对应G通道，等比例获取数值。最终生成png文件供web调用。其中json数据大概9M转换成png之后为90K左右，大大减轻了网络传输压力。
[0014]3、本专利技术中，本专利技术将json文件转换成png文件的话，承载相同大小的数据量png文件更小，有利于传输，并且可以按照自定义规则生成png，加密png承载数据的意义，前端按照自定义规则反向解析的数据，同时，专业人员更习惯使用风矢的方式标识数据，非专业人员可能更倾向于数值或者渲染颜色等更直观的查看，当前技术提出了按照色带渲染不同数值的方案，并且在该渲染基础上添加风矢、数值与粒子，以多种形式更加直观的展示风场数据，方便所有人查看使用。
[00本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种基于气象数据解析和渲染的综合展示系统，包括服务器端和浏览器端，其特征在于：所述服务器端定时获取最新风场数据并将其转换成png文件提供给浏览器端前端渲染展示调用，具体包括以下步骤：步骤S1、数据下载：服务器端设置定时任务执行数据下载脚本，定时下载所需数据，所述数据下载脚本中包括以下步骤：步骤S11、时间获取：获取当前时间，确定分辨率及数据范围来组织下载链接；步骤S12、grib数据下载：服务器端通过下载链接分别下载u、v方向的grib数据；步骤S2、数据处理：服务器端对下载的数据进行处理，所述数据处理包括以下步骤：步骤S21、数据简化：调用ecCodes抽取简化处理grib数据文件的byte数据，得到分散的u、v单量的中间数据文件；步骤S22、数据合并：合并u、v方向上两个grib数据到一个json文件中；步骤S23、转成png：脚本调用js文件处理json生成png，png文件按照日期命名，由于每次都会生成未来七天的数据，所以使用当前新生成的png替换之前的预测数据使数据始终保持实时性，其中所述转成png包括以下步骤：步骤S231、u、v数据数值获取：获取u、v数据中的最大值最小值；步骤S232、png数值生成：png中每个像素值都存放对应数值，通过计算u、v数据中的最大值最小值与当前像素中u、v数据的比例对每个png像素值计算，从而生成png文件供浏览器端调用；步骤S3、图层生成：浏览器端基于leaflet框架渲染风场数据，生成leaflet图层，所述图层生成包括以下步骤：步骤S31、请求数据：浏览器端获取生成的png数据；步骤S32、解析数据：浏览器端按照数据生成的规则反向解析数据；步骤S33、渲染图层：获取当前屏幕显示范围，根据显示范围选取对应所有png像素值数据，进而计算出风速及风向数据；颜色渲染：浏览器端调用双线性插值法插值出当前屏幕范围内的数据，每个数据按照色带区间渲染图层，不同数值使用不同颜色表示，进而生成渲染图层；数值渲染：获取当前地图缩放级别与显示范围，计算每个数值相隔距离，在canvas上绘制对应风速值；风矢渲染：获取当前地图缩放级别与显示范围，计算每个风矢相隔距离，再获取不同级别的风矢图标，根据风向旋转风矢图标，并通过canvas依次绘制不同位置风矢信息；粒子渲染...

【专利技术属性】
技术研发人员：张念华，王光峻，张梦圆，邢永超，冯晨，庄肃生，
申请(专利权)人：青岛恒天翼信息科技有限公司，
类型：发明
国别省市：