Question

我在项目中使用leaflet rotate，但在缩放时遇到多边形和线的问题。 example

<script src="js/leaflet.rotate.js"></script>
<link href="css/leaflet.rotate.css" rel="stylesheet" type="text/css">
<div id="mapID"></div>
<script>
var mymap = L.map('mapid').setView([51.505, -0.09], 13);

L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken}', {
    attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
    maxZoom: 18,
    id: 'mapbox.streets',
    accessToken: 'your.mapbox.access.token'
}).addTo(mymap);

var polygon = L.polygon([
    [51.509, -0.08],
    [51.503, -0.06],
    [51.51, -0.047]
]).addTo(mymap);
</script>

我认为这与我自己的代码有冲突，但是使用传单多边形示例以及“传单旋转” JS和CSS将上面的示例综合在一起，但仍然可以解决问题。

我很确定这是CSS问题，但不确定从哪里开始。

在桌面上，多边形会按缩放比例移动，然后在缩放完成后重新固定在适当的位置，但在移动设备上，情况更糟，因为多边形并不总是会快速固定回正确的位置。

任何帮助将不胜感激。我确实在github存储库中放了一个问题，但是到目前为止开发人员还没有任何回应，如果我能够找到解决方案，我将提交修复请求。

单张旋转缩放问题

0 个答案: