cartodb/Leaflet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix zoom when map container is scaled (#5794)

Browse Source 
* fix zoom when container is scaled

* add map-scaled debug page
This commit is contained in:
Andrew 2017-09-29 16:11:14 +02:00 committed by Vladimir Agafonkin
parent 2a324b0b94
commit 899bdd43de
2 changed files with 42 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
debug/map/map-scaled.html Normal file
View File

@ -0,0 +1,38 @@
<!DOCTYPE html>
<html>
<head>
<title>Leaflet debug page</title>
<link rel="stylesheet" href="../../dist/leaflet.css" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="../css/screen.css" />
<style>
#map {
width: 400px;
height: 300px;
transform: scale(1.5, 1.5);
transform-origin: 0 0;
}
</style>
<script src="../leaflet-include.js"></script>
</head>
<body>
<div id="map"></div>
<script>
var osmUrl = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
osmAttrib = '&copy; <a href="http://openstreetmap.org/copyright">OpenStreetMap</a> contributors',
osm = L.tileLayer(osmUrl, {maxZoom: 18, attribution: osmAttrib});
var map = L.map('map')
.setView([50.5, 30.51], 15)
.addLayer(osm);
</script>
</body>
</html>

6
src/dom/DomEvent.js
View File

@ -227,9 +227,11 @@ export function getMousePosition(e, container) {
var rect = container.getBoundingClientRect();
var scaleX = rect.width / container.offsetWidth || 1;
var scaleY = rect.height / container.offsetHeight || 1;
return new Point(
e.clientX - rect.left - container.clientLeft,
e.clientY - rect.top - container.clientTop);
e.clientX / scaleX - rect.left - container.clientLeft,
e.clientY / scaleY - rect.top - container.clientTop);
}
// Chrome on Win scrolls double the pixels as in other platforms (see #4538),