加载非全球范围的ImageSource时，点击图层查询数据会随着地图缩放出现不同情况的偏移问题

[quaner123321]

const imageSource = new mtkWind.ImageSource(layerId, {
type: mtkWind.LayerSourceType.image,
coordinates: config.coordinates,
decodeType: mtkWind.DecodeType.imageWithExif,
wrapX: config.wrapX ?? true,
url: config.url,
});

  const interpolateColor = this.createInterpolateColor(colorScheme);
  const layer = new mtkWind.Layer(layerId, imageSource, {
    styleSpec: {
      'fill-color': [
        'interpolate',
        ['step', 1],
        ['get', 'value'],
        ...interpolateColor,
      ],
      opacity: config.opacity ?? 0.8,
    },
    renderFrom: mtkWind.RenderFrom.rg,
    displayRange: config.displayRange,
    renderType: mtkWind.RenderType.colorize,
    picking: true,
  });
  
  this.map.addLayer(layer);
  this.map.on('click', e => {
    let pixel = this.map?.coordinateToContainerPoint(e.coordinate);
    
    layer.layer.picker([pixel.x, pixel.y]).then((result: any) => {
      // 使用新增的方法获取风力和风向
      const windInfo = WeatherUtils.windUtil.uv2WindInfo(result[0], result[1]);
      console.log('完整风信息:', windInfo);
    })
});

实际只有红框处才能点出数值

[dosubot]

Hi @quaner123321! I'm Dosu and I’m helping the wind-layer team.

你遇到的点击偏移问题，主要原因是非全球范围的 ImageSource 图层在 wrapX 启用（或配置不当）时，坐标映射和像素 picking 逻辑容易出现错位，尤其是在缩放或地图投影与图片实际范围不完全匹配时。只有红框区域能正确返回数值，说明只有这部分的坐标映射和数据实际重叠，其他区域则因为映射关系不对导致 picking 失败或偏移。

建议排查和尝试：

1. 检查 config.coordinates 是否严格对应图片的实际地理范围（左上、右上、右下、左下经纬度），并确保顺序和投影一致。
2. 对于非全球图片，建议将 wrapX 显式设置为 false，避免地图横向重复导致坐标映射混乱（见相关讨论）。
3. 如果图片带有 EXIF 信息，确保 decodeType 和图片格式（如 JPEG）一致，PNG 不支持 EXIF，可能导致地理参考丢失（见相关说明）。
4. 若数据只覆盖局部区域，务必保证 picking 时的像素坐标和地理坐标转换逻辑与实际图片范围严格对应，否则 zoom 变化时会出现偏移。
5. 若数据 Y 轴方向与地图渲染方向相反，可尝试配置 flipY 选项。

如果调整后仍有问题，可以进一步提供 config.coordinates 的具体值和图片地理范围，便于定位映射关系。

To reply, just mention @dosu.

---

Share context across your team and agents. Try Dosu.

[quaner123321]

谢谢回复，问题已解决，是电脑自身的缩放导致