1
저는 프로젝트에 캔버스를 사용하고 있고 기울이는 많은 요소가 있습니다. 나는 단지 y 값을 비뚤어지고, 기울어 진 후에 이미지의 새로운 너비가 무엇인지 알고 싶다. 그래서 다른 캔버스 요소와 정렬 할 수있다. 내가캔버스에서 비뚤어 질 때 새 너비를 계산하십시오.
ctx.save();
//skew the context
ctx.transform(1,0,1.3,0,0,0);
//draw two images with different heights/widths
ctx.drawImage(image,0,0,42,60);
ctx.drawImage(image,0,0,32,25);
이 목표는 내가 0,0를 그리기 전에 일부 번역을 할 수 있도록 42 60 이미지가 X 60 이미지로 지금 것을 알게 될 것입니다 무엇을 의미하는지에 관해 알기 위해 아래 코드를 확인하십시오. 각 이미지를 개별적으로 측정하기는 쉽지만 프로젝트 전체에서 정렬해야하는 스큐 값과 높이/너비가 다릅니다. 이미지는이 공식이 빠르게 무너 불구하고 넓은되는 때
var skewModifier = imageWidth*(8/6)+(19/3);
var skewAmount = 1.3; //this is dynamic in my app
var width = (skewModifier*skewAmount)+imageWidth;
(나는 그것이 경사 식하지 이와 같은 직선 값 생각) : 현재이 코드 (25, 42 폭 사이의 이미지를 친절하게 작동)를 사용합니다. 캔버스가 왜곡에 대해 어떤 아이디어가 있습니까?
입니다. 너비와 높이를 감안할 때 X에 비뚤어 질 때 이미지의 새로운 너비를 알 수 있습니까? (높이가 가로 스큐 일지라도 효과가있는 것으로 보입니다). – Jeremy
좋아, 나는 점점 가까워지고있어. 나는 이제 이미지의 대각선 길이를 얻고이를 왜곡하면 나는 올바른 가치에 가깝다는 것을 알아 냈다. 여전히 꽤 아직 없습니다. 어떤 아이디어? – Jeremy
'ctx.transform (1,0,1.3,0,0,0);이 아닌'ctx.transform (1,0,1.3,0,0,0);을 정말로 사용하십니까? –