{"id":14234,"date":"2023-10-07T08:39:25","date_gmt":"2023-10-06T23:39:25","guid":{"rendered":"http:\/\/www.gisdeveloper.co.kr\/?p=14234"},"modified":"2025-10-13T08:45:50","modified_gmt":"2025-10-12T23:45:50","slug":"lil-gui-%ec%bd%94%eb%93%9c","status":"publish","type":"post","link":"http:\/\/www.gisdeveloper.co.kr\/?p=14234","title":{"rendered":"lil-gui \ucf54\ub4dc"},"content":{"rendered":"<p>\uacf5\uc2dd \uc0ac\uc774\ud2b8\ub294 https:\/\/lil-gui.georgealways.com\/ \uc785\ub2c8\ub2e4.<\/p>\n<p>\ud328\ud0a4\uc9c0 \uc124\uce58\ub294 \ub2e4\uc74c\uacfc \uac19\uc2b5\ub2c8\ub2e4.<\/p>\n<p><code>npm i lil-gui<\/code><\/p>\n<p>\ud544\uc694\ud55c import \ubb38\uc740 \ub2e4\uc74c\uacfc \uac19\uc2b5\ub2c8\ub2e4.<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\">\r\nimport * as dat from \"lil-gui\"\r\n<\/pre>\n<p>\ucc38\uace0\ub85c three\ub97c \uc124\uce58\ud558\uba74 lil-gui\uac00 \ub364\uc73c\ub85c \uc81c\uacf5\ub429\ub2c8\ub2e4. three \uc124\uce58\ub97c \ud1b5\ud574 \uc81c\uacf5\ub418\ub294 lil-gui\ub97c \uac00\uc838\ub2e4 \uc4f0\uae30 \uc704\ud55c import \ubb38\uc740 \ub2e4\uc74c\uacfc \uac19\uc2b5\ub2c8\ub2e4.<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\">\r\nimport { GUI } from 'three\/addons\/libs\/lil-gui.module.min.js';\r\n<\/pre>\n<p>\uc0ac\uc6a9 \ucf54\ub4dc \uc608\uc2dc\ub294 \ub2e4\uc74c\uacfc \uac19\uc2b5\ub2c8\ub2e4.<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\">\r\nconst gui = new dat.GUI()\r\n\r\nconst obj = {\r\n  value: 0.5,\r\n  color: \"#ff0000\"\r\n}\r\n\r\ngui.add(obj, \"value\").min(0).max(1).step(0.01).name(\"title\")\r\ngui.addColor(obj, \"color\").onChange((v) => { console.log(v, obj.color) })\r\n<\/pre>\n<p>\uac04\ub2e8\ud788 \ud074\ub9ad\ud574\uc11c \ucf54\ub4dc\ub97c \uc2e4\ud589\ud558\ub294 \ubc84\ud2bc\uc744 \ucd94\uac00\ud558\ub294 \ucf54\ub4dc\uc785\ub2c8\ub2e4.<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"js\">\r\nconst toggle = {\r\n  func: () => {\r\n    toggle.flag = !toggle.flag;\r\n    if(toggle.flag) {\r\n      \/\/ \ube14\ub77c\ube14\ub77c..\r\n    } else {\r\n      \/\/ \uc060\ub77c\uc060\ub77c..\r\n    }\r\n  },\r\n  flag: 1\r\n}\r\n\r\ngui.add(toggle, \"func\").name(\"toggle\");\r\n<\/pre>\n","protected":false},"excerpt":{"rendered":"<p>\uacf5\uc2dd \uc0ac\uc774\ud2b8\ub294 https:\/\/lil-gui.georgealways.com\/ \uc785\ub2c8\ub2e4. \ud328\ud0a4\uc9c0 \uc124\uce58\ub294 \ub2e4\uc74c\uacfc \uac19\uc2b5\ub2c8\ub2e4. npm i lil-gui \ud544\uc694\ud55c import \ubb38\uc740 \ub2e4\uc74c\uacfc \uac19\uc2b5\ub2c8\ub2e4. import * as dat from &#8220;lil-gui&#8221; \ucc38\uace0\ub85c three\ub97c \uc124\uce58\ud558\uba74 lil-gui\uac00 \ub364\uc73c\ub85c \uc81c\uacf5\ub429\ub2c8\ub2e4. three \uc124\uce58\ub97c \ud1b5\ud574 \uc81c\uacf5\ub418\ub294 lil-gui\ub97c \uac00\uc838\ub2e4 \uc4f0\uae30 \uc704\ud55c import \ubb38\uc740 \ub2e4\uc74c\uacfc \uac19\uc2b5\ub2c8\ub2e4. import { GUI } from &#8216;three\/addons\/libs\/lil-gui.module.min.js&#8217;; \uc0ac\uc6a9 \ucf54\ub4dc \uc608\uc2dc\ub294 \ub2e4\uc74c\uacfc \uac19\uc2b5\ub2c8\ub2e4. const gui = new &hellip; <\/p>\n<p class=\"link-more\"><a href=\"http:\/\/www.gisdeveloper.co.kr\/?p=14234\" class=\"more-link\">\ub354 \ubcf4\uae30<span class=\"screen-reader-text\"> &#8220;lil-gui \ucf54\ub4dc&#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":[1],"tags":[],"class_list":["post-14234","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/14234","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=14234"}],"version-history":[{"count":5,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/14234\/revisions"}],"predecessor-version":[{"id":16322,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=\/wp\/v2\/posts\/14234\/revisions\/16322"}],"wp:attachment":[{"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=14234"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=14234"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/www.gisdeveloper.co.kr\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=14234"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}