search

maptalks / maptalks.js

A light and plugable JavaScript library for integrated 2D/3D maps.
https://maptalks.org
BSD 3-Clause "New" or "Revised" License
4.28k stars 499 forks source link

Layer swipe effect #1069

Closed Thinker-luo closed 4 years ago

Thinker-luo commented 4 years ago

Issue description

官网上"图层卷帘效果"两个layer的显示效果并不一致，位置和缩放级别都有偏差，并且当pitch发生改变时，卷帘效果效果就没有了。

网站例子效果： 20200209022427

换成天地图之后的效果： 20200209023919

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

https://maptalks.org/examples/en/layer/swipe/#layer_swipe

fuzhenn commented 4 years ago

谢谢报告issue，能否提供一个天地图出错的codepen重现代码？

Thinker-luo commented 4 years ago

谢谢报告issue，能否提供一个天地图出错的codepen重现代码？

代码并未修改，只是把TileLayer切片图的urlTemplate地址换成了天地图官网提供的地形图和影像图

天地图地形图： urlTemplate: 'https://t{s}.tianditu.gov.cn/vec_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=vec&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=44964a97c8c44e4d04efdf3cba594467', subdomains: ['0', '1', '2', '3', '4', '5']

天地图影像图： urlTemplate: 'https://t{s}.tianditu.gov.cn/img_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=44964a97c8c44e4d04efdf3cba594467', subdomains: ['0', '1', '2', '3', '4', '5'],

fuzhenn commented 4 years ago

我这里没能重现你说的天地图两边不一致的情况，本地测试是正常。 https://codepen.io/fuzhenn-the-decoder/pen/JjddarP

Thinker-luo commented 4 years ago

我这边显示还是不正常，是否跟显示器有关，我电脑是4K的显示屏。 20200211172441

fuzhenn commented 4 years ago

确实是4k屏的问题。

这个问题已经在https://github.com/maptalks/examples/commit/3212f1cfe1969827fac3f72fdf79a2435973c1fc 和 https://github.com/maptalks/examples/commit/56c741b780410c643c203220b08e40c3aa9b3780 中解决，examples中的示例过一会应该就会自动发布更新。

我把codepen的代码也修改更新了，可以参考一下。

Thinker-luo commented 4 years ago

好的，已经看到所要的效果了，非常感谢。