sakitam-fdd / wind-layer

:flags: :rocket: wind-layer | a openlayers && maptalks && amap && bmap && leaflet && mapbox-gl && maplibre-gl extension like windy.com for weather visualization
https://sakitam-fdd.github.io/wind-layer/
Other
557 stars 151 forks source link

高德地图的问题 #41

Closed linrong closed 4 years ago

linrong commented 4 years ago

首先感谢大佬开源的这个插件,star先点上,然后我在使用中遇到一些问题,希望大佬可以提供一些帮助,非常感激: 1.高德地图的默认缩放等级为3-18,为什么使用例子里面的json文件发现在等级3-9好像不会显示风场,要10之后的才可以显示(data.json) 2.为什么地图中心移动到太平洋时也不能显示风场,要移动到其他地方风场才会正常显示?(例子中的高德地图例子) 3.大佬各个颜色代表什么的阿,我猜测和风速有关?不知道大佬你的配置颜色代表什么含义?大佬有这方面的资料推荐一下或者说明一下吗? 4.经纬度坐标问题,大佬,这个高德地图的风场的坐标是那个坐标系的?我了解的好像有地球坐标,火星坐标,百度的坐标?不是这方面的工作人员,所以不是很了解,对于高德地图版本使用的坐标大佬也可以推荐一些资料吗?

sakitam-fdd commented 4 years ago

@linrong

  1. 第一个问题,并没有复现,不过在zoom小于五时会不渲染,可能原因参见第二条。
  2. 这个是因为每个地图引擎的视野的裁剪方式不太一样,百度和高德好像默认会将视野的返回裁剪到[-180, 180] [-90, 90],而openlaye和leaflet已经一些开源的引擎不会去裁剪坐标,视野往两边延伸会逐渐减少或增加,这个有兴趣你可以自己研究一下。采用的windy.js 核心库不能直接处理裁剪后的视野,所以现在会有这个问题。
  3. 代表的风速颜色,具体可以查看:https://github.com/sakitam-fdd/wind-layer/blob/master/src/windy/windy.js#L420 https://github.com/sakitam-fdd/wind-layer/blob/master/src/windy/windy.js#L384 配置依据是风速设置的强度的最大值和最小值(https://github.com/sakitam-fdd/wind-layer/blob/master/src/windy/windy.js#L38)的 区间按照colorScale(https://github.com/sakitam-fdd/wind-layer/blob/master/src/windy/windy.js#L46)等分处理的
  4. 坐标系这个问题,国内地图除了百度采用的BD09外其他的一半都采用的是GCJ02(https://github.com/hujiulong/gcoord#%E5%85%B3%E4%BA%8E%E5%9D%90%E6%A0%87%E7%B3%BB)。另外风场的这个默认是按照经纬度来计算的所以应该是会和底图有一定的偏移,这个目前还没有对接所依赖地图的投影转换方法,后期有计划支持
linrong commented 4 years ago

@sakitam-fdd 第一第二个问题确实是你说的问题,如果页面显示有日期变更线在页面中,就会不能正确的显示风场,不知道你那边有没有比较好的建议或者其他的实现方式推荐?因为之前的东西都是使用高徳地图实现了,不能切换掉高徳地图,确实比较麻烦

sakitam-fdd commented 4 years ago

@linrong 我抽空看看这个问题,简单重新计算视图范围可以临时解决这个问题

linrong commented 4 years ago

@sakitam-fdd 好的,谢谢大佬,不知道大佬什么时候可以弄出来?或者告诉我一下应该怎么修改?我尝试修改下?

sakitam-fdd commented 4 years ago

@linrong 高德的那个修复了,晚上会发一个新版本 ✌️

linrong commented 4 years ago

@sakitam-fdd 好的,谢谢大佬,大佬还有一个问题,你知道风场文件转成json之后里面的内容的含义吗?比如风向和风速的单位?data里面的数据怎么和经纬度对应的?如果自己使用数据构建一个json应该要提供json里面的什么数据? 大佬有这方面的资料吗?我google只有在so里面看到一点资料

sakitam-fdd commented 4 years ago

@linrong 那个是UV分量,可以去了解一下气象数据相关的内容。 现有需要关键参数: image

// dx: x方向间隔 nx,ny 行列数
(lo2 - lo1) / dx = nx

还有相关的解析可以看下这个:https://software.ecmwf.int/wiki/display/GRIB/Releases

linrong commented 4 years ago

@sakitam-fdd 谢谢大佬的更新,但是我应该怎么样子使用到大佬你的最新更新,我是要使用源码吗?当前我是通过cdn引入amap.js的,版本好像没有更新

sakitam-fdd commented 4 years ago

@linrong 那个确实没有更新,还有一个小问题没有修复,晚上会发新版

linrong commented 4 years ago

@sakitam-fdd json数据中的U和V是代表经纬度上的分量?我一开始还以为是风速和风向的,还有parameterCategory和parameterNumber是需要的吗?代表什么含义呢?请原谅我的失败,你给的那个网址我只能找到一些关于GRIB API软件的发布和版本信息,希望大佬可以解答一下,目前我手头上的数据是全球50hpa的经纬度分辨率1度的风向,风速数据,我大概知道风向和风速需要转换为UV(或者是否可以直接使用风速风向),但是不确定是否需要其他数据,上面你提供的截图中的parameterCategory和parameterNumber还没有找到资料,希望大佬可以解答一下

linrong commented 4 years ago

@sakitam-fdd 你好,目前使用还是有一些问题,如下图 TIM截图20191202161048.png 这是高德地图上缩放等级为三的显示,明显风场数据一路向北,不符合数据的 TIM截图20191202161146.png 这是同一组风场数据缩放等级放大之后的显示,这时候的数据差不多是正确的,所以问题是为什么在缩放等级比较小的时候的风场显示不正确的呢?

而且还有一个问题,如下图 TIM截图20191202161228.png 这个图里面指的地方用不同的图都会显示一个很明显的分割,是不是在这里坐标有问题

linrong commented 4 years ago

@sakitam-fdd 大佬,这个高德地图的显示还是有问题 在缩放等级3时移动地图显示如下: TIM截图20191202161228.png 然后向右边移动一点显示如下: TIM截图20191203151049.png 明显同一个风场的数据源移动地图就显示两个不同的显示效果, 还有一些地方也是在不同的地图中心时显示不同,如下:

TIM截图20191203151120.png TIM截图20191203151155.png 北美地区同一个数据源同一个缩放等级下,移动缺显示不同的效果

sakitam-fdd commented 4 years ago

@linrong 高德的这个问题不是很好解决,我尝试一下新方案,可能需要一段时间

linrong commented 4 years ago

@sakitam-fdd 好的,麻烦大佬了

bibichuan commented 4 years ago

我也有同样的问题,大佬能不能出篇教程,讲解一下如何生成gfs格式的数据。 `VectorField.read = function(data) { var field = []; var w = data[0].header.nx; var h = data[0].header.ny; var n = 2 w h; var i = 0;

var total = 0;
var weight = 0;
for (var x = 0; x < w; x++) {
    field[x] = [];
    for (var y = 0; y < h; y++) {
        var vx = data[0].data[w*y+x];
        var vy = data[1].data[w*y+x];
        var v = new Vector(vx, vy);
        var ux = x / (w - 1); // 计算格网点所在位置比率
        var uy = y / (h - 1);
        var lon =  data[0].header.lo1 * (1 - ux) + data[0].header.lo2 * ux; // 计算向量点的经度
        var lat =  data[0].header.la1 * (1 - uy) + data[0].header.la2 * uy; // 计算向量点的纬度
        var m = Math.PI * lat / 180; // 将向量点的纬度转为弧度
        var length = v.length();
        if (length) {
            total += length * m;
            weight += m;
        }
        v.x /= Math.cos(m);
        v.setLength(length);
        field[x].push(v);
    }
}
var result = new VectorField(field, data[0].header.lo1, data[0].header.la1, data[0].header.lo2, data[0].header.la2);

// window.console.log('total = ' + total); // window.console.log('weight = ' + weight); if (total && weight) {

  result.averageLength = total / weight;
}
return result;

}; ` 这是别人写的读取gfs格式,将其转成经纬度,我就是不太明白v.x/=Math.cos(m)这一步做了什么?还有就是别人也用了图片中读取gfs数据,我还想知道如何将gfs数据写入到图片中?

sakitam-fdd commented 4 years ago

@bibichuan 等过段时间有空重构完会好好写下文档,完善一下这块内容