我需要在地图上展示一个5x5度的饼状图。我可以使用 leaflet-dvf 库来显示饼状图,但我需要提供半径的像素值,并且目前它是静态的。
我希望能够动态设置,在任何缩放级别下,饼状图都可以填充5x5的正方形区域(即半径为5x5度长度)。
我如何知道在不同缩放级别下5x5度正方形的边长对应的像素长度?
谢谢。
我希望能够动态设置,在任何缩放级别下,饼状图都可以填充5x5的正方形区域(即半径为5x5度长度)。
我如何知道在不同缩放级别下5x5度正方形的边长对应的像素长度?
谢谢。
metresPerPixel = 40075016.686 * Math.abs(Math.cos(map.getCenter().lat / 180 * Math.PI)) / Math.pow(2, map.getZoom()+8);
http://wiki.openstreetmap.org/wiki/Zoom_levels
然后我计算了赤道上一个5x5的正方形的长度:556000米。 然后我储存了缩放级别为0时的长度比例: $scope.lengthRatio = 556000 / 156412 // 以米/像素为单位
最后,我根据缩放级别($scope.mapZoom)获取饼图的半径:
var radius = $scope.lengthRatio * Math.pow(2,$scope.mapZoom)) / 2
/2是因为我想要半径而不是直径。
简单吧!