사용자 지정 도형에 적용되는 텍스처의 좌표계를 변경합니다.
texture()가 작동하려면 해당 도형은 표면의 점을 이미지의 픽셀에 매핑해야 합니다. rect()와 box()와 같은 내장된 도형은 이미 그들의 꼭짓점에 기반한 텍스처 매핑을 가지고 있습니다. vertex()로 생성된 사용자 지정 도형은 uv 좌표로 전달되어야 합니다.
각 vertex() 호출은 5개의 인수를 포함해야 합니다. 예를 들어 vertex(x, y, z, u, v)는 좌표 (x, y, z)에 있는 꼭짓점을 이미지의 좌표 (u, v)에 매핑합니다. 예를 들어, 기본적으로 직사각형의 모서리는 다음과 같이 매핑됩니다:
// Apply the image as a texture. texture(img); <p>// Draw the rectangle. rect(0, 0, 30, 50); </p>위의 코드 스니펫의 이미지가 300 x 500 픽셀의 크기를 가진다면, 동일한 결과는 다음과 같이 얻을 수 있습니다:
// Apply the image as a texture. texture(img); <p>// Draw the rectangle. beginShape();</p> <p>// Top-left. // u: 0, v: 0 vertex(0, 0, 0, 0, 0);</p> <p>// Top-right. // u: 300, v: 0 vertex(30, 0, 0, 300, 0);</p> <p>// Bottom-right. // u: 300, v: 500 vertex(30, 50, 0, 300, 500);</p> <p>// Bottom-left. // u: 0, v: 500 vertex(0, 50, 0, 0, 500);</p> <p>endShape(); </p>textureMode()는 uv 좌표계를 변경합니다.
매개변수인 mode는 두 가지 상수를 받습니다. NORMAL이 전달되면 textureMode(NORMAL)처럼, 텍스처의 uv 좌표는 이미지의 크기 대신 0에서 1의 범위로 제공될 수 있습니다. 이는 다른 크기의 여러 이미지에 대해 동일한 코드를 사용하는 데 도움이 될 수 있습니다. 예를 들어, 위의 코드 스니펫은 다음과 같이 다시 작성할 수 있습니다:
// Set the texture mode to use normalized coordinates. textureMode(NORMAL); <p>// Apply the image as a texture. texture(img);</p> <p>// Draw the rectangle. beginShape();</p> <p>// Top-left. // u: 0, v: 0 vertex(0, 0, 0, 0, 0);</p> <p>// Top-right. // u: 1, v: 0 vertex(30, 0, 0, 1, 0);</p> <p>// Bottom-right. // u: 1, v: 1 vertex(30, 50, 0, 1, 1);</p> <p>// Bottom-left. // u: 0, v: 1 vertex(0, 50, 0, 0, 1);</p> <p>endShape(); </p>기본적으로 mode는 IMAGE이며, uv 좌표를 이미지의 크기로 조정합니다. textureMode(IMAGE)를 호출하면 기본값이 적용됩니다.
참고: textureMode()는 WebGL 모드에서만 사용할 수 있습니다.
예제
구문
textureMode(mode)매개변수
IMAGE 혹은 NORMAL 중 하나.