저는 현재 이미지를 "웹 사이트"로 변환하는 프로그램을 만들고 있습니다. 단순히 픽셀을 가져 와서 색상과 위치를 얻은 다음 div로 변환하는 것입니다.
문제는 div가 너무 많으면 내 브라우저 (Google Chrome)가 충돌한다는 것입니다. 또한 기본적으로 프로그램이 모든 n 번째 픽셀을 가져 와서 변환하는 품질을 구현했습니다. 40의 품질로 내 프로그램은 약 600 div를 생성하지만 Chrome은 이것을 처리 할 수 없습니다.
div에 대한 대안이 있습니까? 나는 이미 캔버스를 시도했지만 실제로 위치를 설정할 수 없었습니다. 캔버스의 위치를 설정하는 방법을 알고 있거나 div의 좋은 대안을 안다면 매우 감사 할 것입니다.
HTML5 Canvas를 사용하는 것이 더 쉬울 것입니다. 원하는 양의 픽셀을 칠하려면 모든 좌표와 색상 만 있으면됩니다.
Canvas에 대한 자세한 정보와 문서는 https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API 를 확인 하십시오.
픽셀 페인트를 원하지 않는 경우 다음과 같이 캔버스에 이미지를 직접 페인트 할 수도 있습니다.
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
var img=document.getElementById("scream");
ctx.drawImage(img,10,10);
도움이되기를 바랍니다.
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다