如何将以英尺为单位的坐标 (x, y) 转换为像素

Question

我有英尺中物体（在我的例子中是天线）的实时位置（x，y），我想在fabricJs上显示它们canvas（宽度：400 像素和高度：400 像素），单位为像素，但是我不知道 将英尺测量值转换为像素 的公式。

Answer 1

这取决于英尺的面积。如果以英尺为单位的面积 = 1000x1000，您可以这样做：

const areaF = {w: 1000, h: 1000};
const areaP = {w: 400, h: 400};
const locationFeetToPixel (x, y) {
    const relativeX = x / areaF.w;
    const relativeY = y / areaF.h;
    const pX = areaP.w * relativeX;
    const pY = areaP.h * relativeY;
    return {x: pX, y: pY};
}

Answer 2

只需将宽度和高度值与字符串 "px" 连接起来，然后使用 CSS

应用

Answer 3

您可能希望将地图缩小到 400 像素 x 400 像素的网格。假设你有一个 l x w 大小的实时地图，你可以这样做：

function positionToPixels(x, y) { 
    //You may want to parseInt or something
    let newX = 400 * x / w;
    let newY = 400 * y / l;
    return [newX, newY];
}

我们所做的只是说原始对象到边缘的距离将与映射对象到其边缘的距离成正比

如何将以英尺为单位的坐标 (x, y) 转换为像素

How to convert coordinates (x, y) in feet to pixels

javascript

geometry

geolocation

fabricjs