이미지 X & Y 축

Question

이미지가 있습니다 (1536x1536),지도입니다.

그리고 최대 x : 3000.0, 최대 y : 3000.0, 최소 x : -3000.0, 최소 y : -3000.0에 X와 Y 축이 있어야합니다. 내가지도에 위치에 내 좌표 (X, Y)를 변환 할

(상/하 및 좌/우)

의견에서

Answer 1

나는 그것이 자연스러운에서 당신이 그것을 CSS로 이미지 크기를 조정하지만 유지하지 않는 가정 상태. 따라서 비율 차이가있는 번역 개체를 사용할 수 있습니다. 이것이 인 경우 매우 리소스에 따라 다릅니다. 객체 위에 배열을 사용하는 것이 좋습니다 (아래 표시된 코드 참조).

픽셀 변환을 가리 킵니다.

var translate = { 
    x: 1536/6000, 
    y: 1536/6000 
}; 

function pt_translate(pt) { 
    return { 
     x: Math.round((pt.x + 3000) * translate.x), 
     y: Math.round((pt.y + 3000) * translate.y) 
    }; 
} 

// Sample coordinate input: 
pt = { 
    x: -1029.3652, 
    y: 369.122 
}; 

var ptt = pt_translate(pt); 

결과 :

{x: 504, y: 862} 

이상의 샘플 :

Various console log samples

console.log(pt_translate({x:0,y:0}), 'vs', 1536/2, 1536/2); 
console.log(pt_translate({x:3000,y:3000}), 'vs', 1536, 1536); 
console.log(pt_translate({x:-3000,y:-3000}), 'vs', 0,0); 
console.log(pt_translate({x:910,y:-1045}), 'vs', 1000,500); 
console.log(ptt); 

수율 :

{x: 768, y: 768} "vs" 768 768 
{x: 1536, y: 1536} "vs" 1536 1536 
{x: 0, y: 0} "vs" 0 0 
{x: 1000, y: 500} "vs" 1000 500 
{x: 504, y: 862}