{"id":16636,"date":"2026-01-20T10:23:32","date_gmt":"2026-01-20T01:23:32","guid":{"rendered":"http:\/\/www.gisdeveloper.co.kr\/?p=16636"},"modified":"2026-01-20T10:29:49","modified_gmt":"2026-01-20T01:29:49","slug":"tsl%ec%97%90%ec%84%9c-2d-%ed%9a%8c%ec%a0%84","status":"publish","type":"post","link":"http:\/\/www.gisdeveloper.co.kr\/?p=16636","title":{"rendered":"TSL\uc5d0\uc11c 2D \ud68c\uc804"},"content":{"rendered":"<p>\uc5b4\ub5a4 2\ucc28\uc6d0 \uc88c\ud45c(st)\ub97c \uc815\ud574\uc9c4 \uc911\uc2ec\uc810(mid)\uc744 \uae30\uc900\uc73c\ub85c \uc6d0\ud558\ub294 \uac01\ub3c4(rotation)\ub9cc\ud07c \ud68c\uc804\ub41c \uacb0\uacfc\ub97c \uc5bb\ub294 TSL \ud568\uc218 \uc815\uc758\ub294 \ub2e4\uc74c\uacfc \uac19\ub2e4.<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\">\r\nconst _rotate = Fn(([st, rotation, mid]) => {\r\n  return vec2(\r\n    cos(rotation).mul(st.x.sub(mid.x)).add(sin(rotation).mul(st.y.sub(mid.y))).add(mid.x),\r\n    cos(rotation).mul(st.y.sub(mid.y)).sub(sin(rotation).mul(st.x.sub(mid.x))).add(mid.y),\r\n  );\r\n}, { st: 'vec2', rotation: 'float', mid: 'vec2', return: 'vec2'})\r\n<\/pre>\n<p>TSL\uc5d0\uc11c \uc704\uc758 \ud568\uc218\ucc98\ub7fc 2D \ud68c\uc804\uc5d0 \ub300\ud55c \ub0b4\uc7a5 \ud568\uc218\ub97c \uc81c\uacf5\ud558\ub294\ub370 \ubc14\ub85c rotateUV \ub178\ub4dc \ud568\uc218\uc774\ub2e4. rotateUV \ub178\ub4dc \ud568\uc218\ub294 3\ucc28\uc6d0 \uc88c\ud45c\ub97c \ud68c\uc804\ud558\ub294 TSL \ub0b4\uc7a5 \ud568\uc218\uc778 rotate\ub97c \uc0ac\uc6a9\ud55c \uac83\uc5d0 \uc9c0\ub098\uc9c0 \uc54a\ub294\ub2e4. <\/p>\n<p>\uc989, \uc544\ub798\uc758 \uacb0\uacfc\ub294 \ubaa8\ub450 \uac19\ub2e4.<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\">\r\nmaterial.fragmentNode = Fn(([]) => {\r\n  const { x, y } = uv().toVar();\r\n\r\n  const rotatedUv = _rotate(vec2(x, y), Math.PI * 0.25, vec2(0.5));\r\n  \/\/ const rotatedUv = rotateUV(vec2(x, y), Math.PI * 0.25, vec2(0.5)); \/\/ \uc704\uc640 \uac19\uace0\r\n  \/\/ const rotatedUv = rotate(vec2(x, y).sub(vec2(0.5)), Math.PI * 0.25).add(vec2(0.5)) \/\/ \ub610 \uc704\uc640 \uac19\uace0..\r\n\r\n  const l1 = float(0.03).div(length(rotatedUv.sub(vec2(.5, .5)).mul(vec2(.2, 1))));\r\n  const l2 = float(0.03).div(length(rotatedUv.sub(vec2(.5, .5)).mul(vec2(1, .2))));\r\n\r\n  return vec4(vec3(mul(l1, l2)), 2);\r\n})();\r\n<\/pre>\n<p>\uc544\ub798 \uc774\ubbf8\uc9c0\ub294 \uc704\uc758 \ucf54\ub4dc\ub97c \ud1b5\ud574 45\ub3c4 \ud68c\uc804\ub41c \uacb0\uacfc\uc774\ub2e4.<\/p>\n<p><img decoding=\"async\" src=\"http:\/\/www.gisdeveloper.co.kr\/wp-content\/uploads\/2026\/01\/\u1109\u1173\u110f\u1173\u1105\u1175\u11ab\u1109\u1163\u11ba-2026-01-20-10.26.13.png\" alt=\"\" width=\"400\" class=\"aligncenter size-full wp-image-16640\" \/><\/p>\n<p>HDR \uc774\ubbf8\uc9c0\ub85c \ucea1\uccd0\uac00 \uc548\ub418\uc11c \ub108\ubb34 \uad6c\ub9ac\uac8c \ubcf4\uc774\ub294\ub370&#8230;. <\/p>\n","protected":false},"excerpt":{"rendered":"<p>\uc5b4\ub5a4 2\ucc28\uc6d0 \uc88c\ud45c(st)\ub97c \uc815\ud574\uc9c4 \uc911\uc2ec\uc810(mid)\uc744 \uae30\uc900\uc73c\ub85c \uc6d0\ud558\ub294 \uac01\ub3c4(rotation)\ub9cc\ud07c \ud68c\uc804\ub41c \uacb0\uacfc\ub97c \uc5bb\ub294 TSL \ud568\uc218 \uc815\uc758\ub294 \ub2e4\uc74c\uacfc \uac19\ub2e4. const _rotate = Fn(([st, rotation, mid]) => { return vec2( cos(rotation).mul(st.x.sub(mid.x)).add(sin(rotation).mul(st.y.sub(mid.y))).add(mid.x), cos(rotation).mul(st.y.sub(mid.y)).sub(sin(rotation).mul(st.x.sub(mid.x))).add(mid.y), ); }, { st: &#8216;vec2&#8217;, rotation: &#8216;float&#8217;, mid: &#8216;vec2&#8217;, return: &#8216;vec2&#8217;}) TSL\uc5d0\uc11c \uc704\uc758 \ud568\uc218\ucc98\ub7fc 2D \ud68c\uc804\uc5d0 \ub300\ud55c \ub0b4\uc7a5 \ud568\uc218\ub97c \uc81c\uacf5\ud558\ub294\ub370 \ubc14\ub85c rotateUV \ub178\ub4dc \ud568\uc218\uc774\ub2e4. rotateUV \ub178\ub4dc \ud568\uc218\ub294 &hellip; <\/p>\n<p class=\"link-more\"><a href=\"http:\/\/www.gisdeveloper.co.kr\/?p=16636\" class=\"more-link\">\ub354 \ubcf4\uae30<span class=\"screen-reader-text\"> &#8220;TSL\uc5d0\uc11c 2D \ud68c\uc804&#8221;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[153,145],"tags":[],"class_list":["post-16636","post","type-post","status-publish","format-standard","hentry","category-shader","category-three-js"],"_links":{"self":[{"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/16636","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=16636"}],"version-history":[{"count":6,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/16636\/revisions"}],"predecessor-version":[{"id":16644,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/16636\/revisions\/16644"}],"wp:attachment":[{"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=16636"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=16636"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=16636"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}