如何將英尺坐標（x，y）轉換為像素

Question

我有以英尺為單位的對象（在我的情況下為天線）的實時位置（x，y），我想將它們顯示在 fabricJs canvas（寬度：400px 和高度：400px）以像素為單位，但是我沒有知道將英尺測量值轉換為像素的公式。

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

您可能希望將 map 縮小到 400 像素 x 400 像素的網格。 假設您有 alxw 大小的實時 map 您可以執行以下操作：

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

我們所做的只是說原始 object 與邊緣的距離將與映射的 object 與其邊緣的距離成正比

Answer 3

只需使用字符串“px”連接您的寬度和高度值並使用 CSS 應用