Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

offset gcoord底图纠偏出现偏差 #2336

Open
Beats0 opened this issue May 24, 2024 · 1 comment
Open

offset gcoord底图纠偏出现偏差 #2336

Beats0 opened this issue May 24, 2024 · 1 comment
Labels
question

Comments

@Beats0
Copy link

Beats0 commented May 24, 2024

maptalks's version and what browser you use?

maptalks v1.0.0-rc.33

Issue description

将百度地图和天地图叠加在一起并通过offset gcoord纠偏为wgs84坐标类型，发现重叠后有偏差，拖动后偏差会变大，不知道有没有好的解决方案

Please provide a reproduction URL (on any jsfiddle like site)

image

image

image

<!DOCTYPE html>
<html>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>瓦片叠加</title>
<style type="text/css">
    html, body {
        margin: 0px;
        height: 100%;
        width: 100%
    }

    .container {
        width: 100%;
        height: 100%
    }
</style>
<link rel="stylesheet" href="https://unpkg.com/maptalks/dist/maptalks.css">
<script type="text/javascript" src="https://unpkg.com/maptalks/dist/maptalks.min.js"></script>
<script type="text/javascript" src="https://unpkg.com/gcoord/dist/gcoord.global.prod.js"></script>
<body>
<div id="map" class="container"></div>

<script>
  const map = new maptalks.Map('map', {
    center: [120.05391845823735, 30.340233166417452],
    zoom: 18,
    minZoom: 1,
    maxZoom: 19,
    pitch: 0,
    seamlessZoom: false,
    spatialReference: {
      projection: maptalks.projection.EPSG4326,
    },
    baseLayer: new maptalks.TileLayer('road', {
      tileSystem: [1, -1, -180, 90],
      urlTemplate: 'http://t{s}.tianditu.com/DataServer?T=vec_c&x={x}&y={y}&l={z}&tk=de0dc270a51aaca3dd4e64d4f8c81ff6',
      subdomains: ['1', '2', '3', '4', '5'],
      attribution: '&copy; <a target="_blank" href="http://www.tianditu.cn">Tianditu</a>'
    }),
    layers: [
      new maptalks.TileLayer('baidu', {
        spatialReference: {
          projection: maptalks.projection.BAIDU,
        },
        opacity: 0.6,
        'urlTemplate': `https://maponline{s}.bdimg.com/tile/?qt=vtile&x={x}&y={y}&z={z}&styles=pl&scaler=1&udt=20210914`,
        'subdomains': [0, 1, 2, 3],
        'attribution': '&copy; <a target="_blank" href="http://map.baidu.com">Baidu</a>',
        offset: function (z) {
          const map = this.getMap();
          const center = map.getCenter();
          const c = gcoord.transform(
            center.toArray(),
            gcoord.BMap,
            gcoord.WGS84,
          );
          const offset = map
            .coordToPoint(center, z)
            .sub(map.coordToPoint(new maptalks.Coordinate(c), z));
          return offset._round().toArray();
        },
      })
    ]
  });
</script>
</body>
</html>
@ipcjs
Copy link

ipcjs commented Jun 19, 2024

offset是用地图的中心点来计算的，必然出现偏移

bd09和gcj02对坐标点的偏移是没有规律的，按理来说应该没办法对底图做映射？

@deyihu deyihu added the question label Jul 3, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
question
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@ipcjs @deyihu @Beats0