html5 canvas：服务器或客户端从经度纬度快速转换为像素值

Question

我正在使用html5 canvas元素（例如visible here）处理一些地图和动画。）我希望能够有效地生成像素值的线串（x1，y1，x2，y2），理想情况下来自PostGIS，基于画布的几何形状。也就是说，在伪geojson：

"Coordinates":"[[-122.0, 35.0], [-121.0, 36.0]]"

如果函数传递了100px的canvas-width参数，

可能会输出：

"Pixels":"[[30, 40],[50,60]]"

我想最终启用以下网址：

www.example.com/canvas_size:200/box_width:3-miles/center_point:lon|lat

所以我认为这必须动态完成。其他人如何解决这类问题？我想到的是，可能将整个世界视为一个20,000,000像素的画布，以像素形式存储预转换的数据，然后用客户端算法将其抵消。欢迎任何建议，包括我最初想法的方法。如果有人熟悉在Cartagen中是否或如何做到这一点，那么会很感激指向一个或两个函数库的指针。

Answer 1

尝试使用此代码，其中像素将适应画布的高度和宽度：

function getPoint(latitude, longitude, canvas_width, canvas_height) {
            var obj = {};
            obj.x = (latitude * canvas_height / 180.0) + (canvas_height / 2);
            obj.y = (longitude * canvas_width / 360.0) + (canvas_width / 2);
            return obj;
        }