传单：将地图坐标投影到像素坐标答案

【问题标题】：Leaflet: project map coordinates to pixel coordinates传单：将地图坐标投影到像素坐标
【发布时间】：2015-04-10 17:00:51
【问题描述】：

我想要实现的是当在地图上绘制一个矩形时，我想将此矩形地图坐标投影到原始图像的坐标空间中，以便我可以裁剪原始图像并提供下载链接到用户。

但是，我在将矩形地图坐标投影到原始图像中的准确像素坐标时遇到问题。

我认为以下方法会起作用，但是它产生的像素坐标不正确。

map.on('draw:created', function(e){
    var type = e.layerType,
    layer = e.layer;

    if(type == 'rectangle'){
    if(rectangle){
        drawnItems.removeLayer(rectangle);
    }
    rectangle = layer;
    drawnItems.addLayer(rectangle);

    var north_west = rectangle.getBounds().getNorthWest();
    var south_east = rectangle.getBounds().getSouthEast();

    var top_left_pixel = map.project([north_west.lat, north_west.lng], map.getMaxZoom());
    var bottom_right_pixel = map.project([south_east.lat, south_east.lng], map.getMaxZoom());

    alert("top_left_pixel: " + (top_left_pixel.x / 4) + ", " + (top_left_pixel.y / 4) + " bottom_right_pixel: " + (bottom_right_pixel.x / 4) + ", " + (bottom_right_pixel.y / 4));
    }
});

这是从地图坐标（左图）到像素坐标（右图）的精确投影示例。

我做错了什么？

【问题讨论】：

标签： leaflet maptiler

【解决方案1】：

其实我并没有做错什么，上面的想法很完美。

我使用的是原始图像的宽度和高度，但是在处理过程中 MapTiler 改变了基础图像的分辨率。我通过重新生成图块并检查 MapTiler 生成的示例 leaflet.html 来解决这个问题。我惊讶地发现边界设置为 2*（原始基本图像的宽度）和 1.99*（原始基本图像的高度）。

考虑到这些信息修正了我不准确的预测。

【讨论】：