2016-04-05 8 views
0

Hier ist eine Demo, die mein Problem illustriert: Ich zeichne einen Kreis auf einer Karte mit Radius 500000, aber an einem Ort sieht der Kreis größer aus. Ich habe versucht, den Zoom der Karte zu überprüfen und es ist immer dasselbe.Warum ändert sich die Kreisgröße auf der Karte?

place = { 
 
name1:[-33.8650, 151.2094], 
 
name2:[59.3293, 18.0686] 
 
}; 
 

 
var id,circle,center; 
 

 
function panMap() { 
 
    id=this.getAttribute('id'); 
 
    center=place[id]; 
 
    map.panTo(center); 
 
    circle = L.circle(center,500000, { 
 
       color: 'red', 
 
       fillColor: '#f03', 
 
       fillOpacity: 0.5 
 
       }).addTo(map); 
 
    console.log("zoom = " +map.getZoom()); 
 
}; 
 

 
// center of the map 
 
var center = [29,29]; 
 

 
// Create the map 
 
var map = L.map('map').setView(center, 3); 
 

 
// Set up the OSM layer 
 
L.tileLayer(
 
    'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { 
 
    maxZoom: 18 
 
    }).addTo(map); 
 
    
 
var classname = document.getElementsByTagName("button"); 
 
for (var i=0;i<classname.length;i++) { 
 
    classname[i].addEventListener("click", panMap, false); 
 
};
.container { 
 
    height: 30px; 
 
    width:100%; 
 
} 
 
#map { 
 
    height: 400px; 
 
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.0.0-beta.2.rc.2/leaflet.js"></script> 
 
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.0.0-beta.2.rc.2/leaflet.css"> 
 

 
<div class="container"> 
 
<button id="name1">place1</button> 
 
<button id="name2">place2</button> 
 
</div> 
 
<div id="map"></div>

Antwort

1

Dies ist auf die Mercator projection zurückzuführen ist. Wikipedia Zitiert:

die Mercator-Projektion die Größe von Objekten als die Breite verzerrt nehmen vom Äquator zu den Polen, wo die Skala unendlich

Place1 der Breite wird näher am Äquator als Place2 der Breitengrad, so erscheint kleiner.