{"id":14,"date":"2023-11-30T14:21:55","date_gmt":"2023-11-30T14:21:55","guid":{"rendered":"https:\/\/boyan-tabakov.xyz\/?p=14"},"modified":"2024-12-15T18:23:57","modified_gmt":"2024-12-15T18:23:57","slug":"three-js-cube","status":"publish","type":"post","link":"https:\/\/boyan-tabakov.xyz\/index.php\/2023\/11\/30\/three-js-cube\/","title":{"rendered":"Three.js Cube"},"content":{"rendered":"\n<p><a href=\"https:\/\/boyan-tabakov.xyz\/threejs\/cube\">https:\/\/boyan-tabakov.xyz\/threejs\/cube<\/a><\/p>\n\n\n\n<p>I made this to test Three.js on this site, and also because why not?<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1014\" height=\"590\" src=\"https:\/\/boyan-tabakov.xyz\/wp-content\/uploads\/2023\/11\/image.png\" alt=\"\" class=\"wp-image-15\" srcset=\"https:\/\/boyan-tabakov.xyz\/wp-content\/uploads\/2023\/11\/image.png 1014w, https:\/\/boyan-tabakov.xyz\/wp-content\/uploads\/2023\/11\/image-300x175.png 300w, https:\/\/boyan-tabakov.xyz\/wp-content\/uploads\/2023\/11\/image-768x447.png 768w\" sizes=\"auto, (max-width: 1014px) 100vw, 1014px\" \/><figcaption class=\"wp-element-caption\">Screenshot<\/figcaption><\/figure>\n\n\n\n<p>You can press &#8216;H&#8217; key on your keyboard to bring up a popup.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"312\" height=\"558\" src=\"https:\/\/boyan-tabakov.xyz\/wp-content\/uploads\/2023\/11\/image-1.png\" alt=\"\" class=\"wp-image-16\" srcset=\"https:\/\/boyan-tabakov.xyz\/wp-content\/uploads\/2023\/11\/image-1.png 312w, https:\/\/boyan-tabakov.xyz\/wp-content\/uploads\/2023\/11\/image-1-168x300.png 168w\" sizes=\"auto, (max-width: 312px) 100vw, 312px\" \/><figcaption class=\"wp-element-caption\">More Options menu<\/figcaption><\/figure>\n\n\n\n<p>By the way, the &#8220;Measure&#8221; button is broken. I know, yes releasing an unfinished basic project is lazy. Also the folders. I use them as dividers since I have already added the functions and was too lazy to add them to folders.<\/p>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p>If it works, don&#8217;t touch it.<\/p>\n<cite>&#8211; Pretty much every developer<\/cite><\/blockquote>\n\n\n\n<p>You can change the subdivision slider to change subdivisions. They are especially noticeable on the torus, and on the cube with wireframe option enabled.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"323\" height=\"106\" src=\"https:\/\/boyan-tabakov.xyz\/wp-content\/uploads\/2023\/11\/image-2.png\" alt=\"\" class=\"wp-image-17\" srcset=\"https:\/\/boyan-tabakov.xyz\/wp-content\/uploads\/2023\/11\/image-2.png 323w, https:\/\/boyan-tabakov.xyz\/wp-content\/uploads\/2023\/11\/image-2-300x98.png 300w\" sizes=\"auto, (max-width: 323px) 100vw, 323px\" \/><figcaption class=\"wp-element-caption\">Slider<\/figcaption><\/figure>\n\n\n\n<p>You can check the wireframe box to show a wireframe of the objects.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"332\" height=\"226\" src=\"https:\/\/boyan-tabakov.xyz\/wp-content\/uploads\/2023\/11\/image-3.png\" alt=\"\" class=\"wp-image-19\" srcset=\"https:\/\/boyan-tabakov.xyz\/wp-content\/uploads\/2023\/11\/image-3.png 332w, https:\/\/boyan-tabakov.xyz\/wp-content\/uploads\/2023\/11\/image-3-300x204.png 300w\" sizes=\"auto, (max-width: 332px) 100vw, 332px\" \/><figcaption class=\"wp-element-caption\">Buttons.<\/figcaption><\/figure>\n\n\n\n<p>Result of them checked:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"318\" height=\"242\" src=\"https:\/\/boyan-tabakov.xyz\/wp-content\/uploads\/2023\/11\/image-4.png\" alt=\"\" class=\"wp-image-20\" srcset=\"https:\/\/boyan-tabakov.xyz\/wp-content\/uploads\/2023\/11\/image-4.png 318w, https:\/\/boyan-tabakov.xyz\/wp-content\/uploads\/2023\/11\/image-4-300x228.png 300w\" sizes=\"auto, (max-width: 318px) 100vw, 318px\" \/><figcaption class=\"wp-element-caption\">checked buttons<\/figcaption><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"705\" src=\"https:\/\/boyan-tabakov.xyz\/wp-content\/uploads\/2023\/11\/image-5.png\" alt=\"\" class=\"wp-image-21\" srcset=\"https:\/\/boyan-tabakov.xyz\/wp-content\/uploads\/2023\/11\/image-5.png 600w, https:\/\/boyan-tabakov.xyz\/wp-content\/uploads\/2023\/11\/image-5-255x300.png 255w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><figcaption class=\"wp-element-caption\">the effect<\/figcaption><\/figure>\n\n\n\n<p>Now, instead of relying on screenshots, go and try it out!<\/p>\n\n\n\n<iframe src='https:\/\/boyan-tabakov.xyz\/threejs\/cube' width=800 height=600>Iframe failed to load. Use <a href='https:\/\/boyan-tabakov.xyz\/threejs\/cube'>this link to access<\/a><\/iframe>\n\n\n\n<p>If the iframe is too small for you, then <a href=\"https:\/\/boyan-tabakov.xyz\/threejs\/cube\" data-type=\"link\" data-id=\"https:\/\/boyan-tabakov.xyz\/threejs\/cube\">go ahead<\/a>! Use <a href=\"https:\/\/boyan-tabakov.xyz\/threejs\/cube\">the link<\/a>.<\/p>\n\n\n\n<div class='avc_visit_counter_front' style='border: 2px solid #000000;border-radius:5px;font-size: 14px; width: 100%; max-width:200px; margin: 0 auto;padding:5px;'>Visits 0  <\/div>\n","protected":false},"excerpt":{"rendered":"<p>https:\/\/boyan-tabakov.xyz\/threejs\/cube I made this to test Three.js on this site, and also because why not? You can press &#8216;H&#8217; key on your keyboard to bring up a popup. By the way, the &#8220;Measure&#8221; button is broken. I know, yes releasing an unfinished basic project is lazy. Also the folders. I use them as dividers since &#8230; <a title=\"Three.js Cube\" class=\"read-more\" href=\"https:\/\/boyan-tabakov.xyz\/index.php\/2023\/11\/30\/three-js-cube\/\" aria-label=\"Read more about Three.js Cube\">Read more<\/a><\/p>\n","protected":false},"author":1,"featured_media":155,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[14],"tags":[],"class_list":["post-14","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-my-projects"],"_links":{"self":[{"href":"https:\/\/boyan-tabakov.xyz\/index.php\/wp-json\/wp\/v2\/posts\/14","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/boyan-tabakov.xyz\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/boyan-tabakov.xyz\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/boyan-tabakov.xyz\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/boyan-tabakov.xyz\/index.php\/wp-json\/wp\/v2\/comments?post=14"}],"version-history":[{"count":3,"href":"https:\/\/boyan-tabakov.xyz\/index.php\/wp-json\/wp\/v2\/posts\/14\/revisions"}],"predecessor-version":[{"id":66,"href":"https:\/\/boyan-tabakov.xyz\/index.php\/wp-json\/wp\/v2\/posts\/14\/revisions\/66"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/boyan-tabakov.xyz\/index.php\/wp-json\/wp\/v2\/media\/155"}],"wp:attachment":[{"href":"https:\/\/boyan-tabakov.xyz\/index.php\/wp-json\/wp\/v2\/media?parent=14"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/boyan-tabakov.xyz\/index.php\/wp-json\/wp\/v2\/categories?post=14"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/boyan-tabakov.xyz\/index.php\/wp-json\/wp\/v2\/tags?post=14"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}