{"id":15670,"date":"2025-02-01T10:46:48","date_gmt":"2025-02-01T01:46:48","guid":{"rendered":"http:\/\/www.gisdeveloper.co.kr\/?p=15670"},"modified":"2025-09-23T09:09:07","modified_gmt":"2025-09-23T00:09:07","slug":"voro-noise","status":"publish","type":"post","link":"http:\/\/www.gisdeveloper.co.kr\/?p=15670","title":{"rendered":"voro-noise"},"content":{"rendered":"<p>\ub178\uc774\uc988\ub294 \ub80c\ub364\uc744 \uae30\ubc18\uc73c\ub85c \ud558\uba70 FBM(Fractal Brownian Motion)\uc744 \uc704\ud55c \ud55c \uc625\ud0c0\ube0c\ub97c \uad6c\uc131\ud569\ub2c8\ub2e4. \uba87\uac00\uc9c0 \ub178\uc774\uc988 \uc911 \ud558\ub098\ub85c \ubcf4\ub85c\ub178\uc774(Voronoi)\ub97c \uae30\ubc18\uc73c\ub85c \ud558\ub294 voro-noise\uac00 \uc788\ub294\ub370, Shader\uc758 \ub300\uac00\uc778 Inigo\ub2d8\uc774 2014\ub144\uc5d0 \ub9cc\ub4e0 \uc54c\uace0\ub9ac\uc998\uc785\ub2c8\ub2e4. \ub0b4\ubd80 \ucf54\ub4dc\ub97c \ubcf4\uba74 \ud37c\ud37c\uba3c\uc2a4\uc5d0 \ub2e4\uc18c \ubd80\uc815\uc801\uc778 \ubd80\ubd84(\uc77c\ubc18\uc801\uc778 9\uac1c\uc758 \uaca9\uc790 \uadf8\ub9ac\ub4dc\uac00 \uc544\ub2cc 25\uac1c\uc758 \uaca9\uc790 \uadf8\ub9ac\ub4dc\ub97c \uc0ac\uc6a9)\uc774 \ubcf4\uc774\uc9c0\ub9cc \uadf8 \uacb0\uacfc\ub294 \uc5ec\ud0c0 \ub2e4\ub978 \ub178\uc774\uc988\ubcf4\ub2e4 \ud6e8\uc52c \ub6f0\uc5b4\ub0a9\ub2c8\ub2e4.<\/p>\n<p>\uc544\ub798\uc758 \ucf54\ub4dc\ub294 voro-noise\uc5d0 \ub300\ud55c \uad6c\ud604 \ucf54\ub4dc\uc785\ub2c8\ub2e4.<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"glsl\">\r\nvec3 hash3(vec2 p) {\r\n    vec3 q = vec3(\r\n        dot(p, vec2(127.1, 311.7)), \r\n        dot(p, vec2(269.5, 183.3)), \r\n        dot(p, vec2(419.2, 371.9))\r\n    );\r\n    return fract(sin(q) * 43758.5453);\r\n}\r\n\r\nfloat voronoise(in vec2 p, float u, float v) {\r\n    float k = 1.0 + 63.0 * pow(1.0 - v, 6.0);\r\n\r\n    vec2 i = floor(p);\r\n    vec2 f = fract(p);\r\n\r\n    vec2 a = vec2(0.0, 0.0);\r\n    for(int y = -2; y <= 2; y++) {\r\n        for(int x = -2; x <= 2; x++) {\r\n            vec2 g = vec2(x, y);\r\n            vec3 o = hash3(i + g) * vec3(u, u, 1.0);\r\n            vec2 d = g - f + o.xy;\r\n            float w = pow(1.0 - smoothstep(0.0, 1.414, length(d)), k);\r\n            a += vec2(o.z * w, w);\r\n        }\r\n    }\r\n\r\n    return a.x \/ a.y;\r\n}\r\n<\/pre>\n<p>\uc774 \ud568\uc218\uc5d0 \ub300\ud55c \uac00\uc7a5 \ud754\ud55c \ucf54\ub4dc \uc608\uc2dc\ub294 \ub2e4\uc74c\uacfc \uac19\uc2b5\ub2c8\ub2e4.<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"glsl\">\r\nvoid main() {\r\n    vec2 st = gl_FragCoord.xy \/ uResolution.xy;\r\n    st.x *= uResolution.x \/ uResolution.y;\r\n    st *= 10.0;\r\n\r\n    float f = voronoise(st, 1., 1.);\r\n    gl_FragColor = vec4(f, f, f, 1.0);\r\n}\r\n<\/pre>\n<p>\uc704\uc758 \ucf54\ub4dc\uc758 \uacb0\uacfc\ub294 \ub2e4\uc74c\uacfc \uac19\uad6c\uc694.<\/p>\n<p><img decoding=\"async\" src=\"http:\/\/www.gisdeveloper.co.kr\/wp-content\/uploads\/2025\/02\/\u1109\u1173\u110f\u1173\u1105\u1175\u11ab\u1109\u1163\u11ba-2025-02-01-10.33.52.png\" alt=\"\" width=\"600\" class=\"aligncenter size-full wp-image-15675\" \/><\/p>\n<p>voronoise \ud568\uc218\ub294 3\uac1c\uc758 \uc778\uc790\ub97c \ubc1b\ub294\ub370, \uccab\ubc88\uc9f8 \uc778\uc790\ub294 \uc77c\ubc18\uc801\uc73c\ub85c \ub178\uc774\uc988 \ud568\uc218\uac00 \ubc1b\ub294 \uc778\uc790\uc785\ub2c8\ub2e4. 2,3\ubc88\uc9f8 \uc778\uc790\uc778 u\uc640 v\ub294 voronoise\uc5d0 \ud2b9\ud654\ub41c \uc778\uc790\uc778\ub370 u\ub294 \ub178\uc774\uc988 \uc0dd\uc131\uc744 \uaca9\uc790 \uadf8\ub9ac\ub4dc(Grid)\ub97c \uc5bc\ub9c8\ub098 \ubcf4\ub85c\ub178\uc774\uc2a4\ub7fd\uac8c \ud45c\ud604\ud560\uc9c0\uc5d0 \ub300\ud55c \uac15\ub3c4\uac12\uc73c\ub85c 0\uc5d0\uc11c 1\uae4c\uc9c0\uc758 \uac12\uc744 \uac16\uc2b5\ub2c8\ub2e4. v\ub294 \uaca9\uc790 \uadf8\ub9ac\ub4dc \ub0b4\ubd80\ub97c \ucc44\uc6b0\ub294 \uac01 \ud504\ub808\uadf8\uba3c\ud2b8\uc5d0 \ub300\ud55c \ubcf4\uac04 \uc815\ub3c4\uc5d0 \ub300\ud55c \uac15\ub3c4 \uac12\uc778\ub370 0\ubd80\ud130 1\uc758 \uac12\uc774\uba70 0\uc77c\ub54c \uc804\ud600 \ubcf4\uac04\uc774 \uc774\ub8e8\uc5b4\uc9c0\uc9c0 \uc54a\uace0 1\uc77c\ub54c \ucd5c\ub300\uc758 \ubcf4\uac04\uc774 \uc774\ub904\uc9d1\ub2c8\ub2e4. \uc544\ub798\uc758 \uacb0\uacfc\ub294 u\uc640 v\ub97c \ubaa8\ub450 0\uc73c\ub85c \ud588\uc744 \ub54c\uc758 \uacb0\uacfc\uc785\ub2c8\ub2e4.<\/p>\n<p><img decoding=\"async\" src=\"http:\/\/www.gisdeveloper.co.kr\/wp-content\/uploads\/2025\/02\/voronoise_0_0.png\" alt=\"\" width=\"600\" class=\"aligncenter size-full wp-image-15681\" \/><\/p>\n<p>\uc544\ub798\ub294 u\ub97c 1\ub85c v\ub294 0\uc73c\ub85c \ud588\uc744\ub54c\uc758 \uacb0\uacfc\uc785\ub2c8\ub2e4.<\/p>\n<p><img decoding=\"async\" src=\"http:\/\/www.gisdeveloper.co.kr\/wp-content\/uploads\/2025\/02\/voronoise_1_0.png\" alt=\"\" width=\"600\" class=\"aligncenter size-full wp-image-15680\" \/><\/p>\n<p>\ub9c8\uc9c0\ub9c9\uc73c\ub85c \uc544\ub798\ub294 u\ub97c 0\uc73c\ub85c v\ub97c 1\ub85c \ud588\uc744\ub54c\uc758 \uacb0\uacfc\uc785\ub2c8\ub2e4.<\/p>\n<p><img decoding=\"async\" src=\"http:\/\/www.gisdeveloper.co.kr\/wp-content\/uploads\/2025\/02\/voronoise_1_1.png\" alt=\"\" width=\"600\" class=\"aligncenter size-full wp-image-15679\" \/><\/p>\n<p>\uc544\ub798\ub294 \ub178\uc774\uc988 \uad6c\ud604\uc5d0 \ub300\ud55c \uc720\uc6a9\ud55c \uc0ac\uc774\ud2b8\uc785\ub2c8\ub2e4.<\/p>\n<p>https:\/\/gist.github.com\/patriciogonzalezvivo\/670c22f3966e662d2f83<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\ub178\uc774\uc988\ub294 \ub80c\ub364\uc744 \uae30\ubc18\uc73c\ub85c \ud558\uba70 FBM(Fractal Brownian Motion)\uc744 \uc704\ud55c \ud55c \uc625\ud0c0\ube0c\ub97c \uad6c\uc131\ud569\ub2c8\ub2e4. \uba87\uac00\uc9c0 \ub178\uc774\uc988 \uc911 \ud558\ub098\ub85c \ubcf4\ub85c\ub178\uc774(Voronoi)\ub97c \uae30\ubc18\uc73c\ub85c \ud558\ub294 voro-noise\uac00 \uc788\ub294\ub370, Shader\uc758 \ub300\uac00\uc778 Inigo\ub2d8\uc774 2014\ub144\uc5d0 \ub9cc\ub4e0 \uc54c\uace0\ub9ac\uc998\uc785\ub2c8\ub2e4. \ub0b4\ubd80 \ucf54\ub4dc\ub97c \ubcf4\uba74 \ud37c\ud37c\uba3c\uc2a4\uc5d0 \ub2e4\uc18c \ubd80\uc815\uc801\uc778 \ubd80\ubd84(\uc77c\ubc18\uc801\uc778 9\uac1c\uc758 \uaca9\uc790 \uadf8\ub9ac\ub4dc\uac00 \uc544\ub2cc 25\uac1c\uc758 \uaca9\uc790 \uadf8\ub9ac\ub4dc\ub97c \uc0ac\uc6a9)\uc774 \ubcf4\uc774\uc9c0\ub9cc \uadf8 \uacb0\uacfc\ub294 \uc5ec\ud0c0 \ub2e4\ub978 \ub178\uc774\uc988\ubcf4\ub2e4 \ud6e8\uc52c \ub6f0\uc5b4\ub0a9\ub2c8\ub2e4. \uc544\ub798\uc758 \ucf54\ub4dc\ub294 voro-noise\uc5d0 \ub300\ud55c \uad6c\ud604 \ucf54\ub4dc\uc785\ub2c8\ub2e4. &hellip; <\/p>\n<p class=\"link-more\"><a href=\"http:\/\/www.gisdeveloper.co.kr\/?p=15670\" class=\"more-link\">\ub354 \ubcf4\uae30<span class=\"screen-reader-text\"> &#8220;voro-noise&#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,1],"tags":[],"class_list":["post-15670","post","type-post","status-publish","format-standard","hentry","category-shader","category-three-js","category-uncategorized"],"_links":{"self":[{"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/15670","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=15670"}],"version-history":[{"count":14,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/15670\/revisions"}],"predecessor-version":[{"id":16274,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/15670\/revisions\/16274"}],"wp:attachment":[{"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=15670"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=15670"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=15670"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}