Leaflet实现风场流动效果
插件下载地址https://download.csdn.net/download/qq_35131811/10674594
Leaflet实现风场流动效果
1、将leaflet-velocity相关的文件copy到项目目录下,并引用到页面里
2、新建layer并添加到map里,生成的风场效果可以通过下图所示参数进行控制,
也可以直接更改leaflet-velocity.js,如下图:
数据格式见wind-gbr.json,至此已经可以显示风场效果。
3、该插件以正南方向为正方向,可以根据实际情况自己调整方向,我这里调整为正北。该测试数据是100*100的格点数据,是经过如下方式计算UV分量之后的效果,也就是转换为正北方向之后的效果,见下图便可理解。
4、UV分量的计算方式
dir = (270.0-方向)*Math.PI/180.0);
U = (速度* Math.cos(dir );
V = (速度* Math.sin(dir );
因为我要将方向由正南方向转为正北方向,故方向值加180,做如下处理
在做更改之后,也需要更改leaflet-velocity.js中关于风向提示的计算方式,
5、数据格式说明
[
{
“header”:{
“parameterUnit”:”m/s”,//单位
“parameterNumber”:2,//固定值
“dx”:1,//间隔 根据生产的数据自定义
“dy”:1,//间隔 根据生产的数据自定义
“parameterNumberName”:”eastward_wind”,//无意义值,可默认为eastward_wind
“la1”:-6.5,// 纬度
“la2”:-18.5,// 纬度
“parameterCategory”:2,// 固定值
“lo2”:146,// 经度
“nx”:14,//数量
“ny”:22,//数量
“refTime”:”2017-02-01 23:00:00″,//时间
“lo1”:133// 经度
},
“data”:[U分量数据]
},
{
“header”:{
“parameterUnit”:”m/s”,
“parameterNumber”:3,
“dx”:1,
“dy”:1,
“parameterNumberName”:”northward_wind”,
“la1”:-6.5,
“la2”:-18.5,
“parameterCategory”:2,
“lo2”:146,
“nx”:14,
“ny”:22,
“refTime”:”2017-02-01 23:00:00″,
“lo1”:133
},
“data”:[V分量数据]
}
]
———————
作者:高傲的孤独
来源:CSDN
原文:https://blog.csdn.net/qq_35131811/article/details/82761238
版权声明:本文为博主原创文章,转载请附上博文链接!
转载自:https://blog.csdn.net/baidu_38670791/article/details/87801087