동물의 숲 디자인 에디터, 패턴을 QR코드로 변환

이미지
동물의 숲에서 디자인을 가지고 올 수 있는 QR코드를 보고 QR코드를 만들수 있는 게 있을까 싶어 찾아봤더니 웹 에디터가 있네요. https://acpatterns.com/ Browse는 사람들이 올린 패턴이 보이고, Editor는 제작툴 입니다. 웹으로 만들어진 도구라서 그런지 크롬 브라우저에서 페이지 번역을 하면 버튼과 설명이 한글로 보입니다. 좌측에 버튼을 눌러 패턴 설정을 할 수 있습니다. 번역된 내용을 보니 게임 내에서 수정을 하기 위해서는 정식 패턴 파일의 정보를 한 번 로드한 다음에 고유 정보를 카피해 둬야 한다는 것 같습니다. 그렇지 않으면 게임 내에서는 편집 불가라고 하네요. 화면에 직접 그릴 수 도 있고, 외부 이미지를 불러올 수 도 있습니다. 모든 작업이 끝나면 QR코드를 생성해서 스마트폰에서 인식 가능한 QR코드를 만들면 됩니다.

Visual Studio Code에서 일치하는 태그에 커서가 둘로 되는 옵션 끄기

이미지
언제부터인가 '비주얼 스튜디오 코드'에서 HTML 소스를 수정할 때 태그의 열림이나 닫힘 부분에 커서가 있으면 양쪽에 커서가 생기는 기능이 적용되어 있었습니다. 커서가 태그 이름에 있을 때만 적용됩니다. 아마도 태그를 수정할 때 유용하라고 만든 기능 같습니다. 하지만 저는 어색하고 불편해서 이 기능을 끄려고 합니다. 구글에 검색해도 해당 옵션에 대해 나오는 게 없었는데, 그냥 에디터 설정에 들어가서 '커서' 라고 검색하니 해당 옵션이 나왔습니다. '일치하는 HTML 태그에서 미러링 커서를 활성화/비활성화합니다.' (Mirror Cursor On Matching Tag) 위 옵션을 체크해제하면 해당 기능을 막을 수 있습니다.

내가 쓴 유튜브 댓글과 채팅을 확인하고 삭제하는 방법

이미지
지금까지 유튜브 영상을 보다가 작성했던 댓글을 확인하거나 지울 수 있는 경로입니다. 유튜브의 좌측 메뉴에서, '라이브러리 -> 기록의 모두보기' 혹은 '최근 본 동영상'을 누르면 페이지가 나옵니다. 오른쪽에 '댓글' 항목을 선택하면 지금까지 작성한 댓글들을 확인할 수 있습니다. '실시간 채팅' 항목의 경우, '실시간 스트리밍' 영상이나 '최초 공개' 도중 내가 작성했던 채팅 내용을 확인하고 지울 수 있습니다.

iframe 에 비어있는 페이지 띄우기

iframe이 삽입된 모달이 있습니다. iframe에 불려오는 페이지는 백그라운드 작업을 하고 있습니다. 그래서 모달이 숨겨질 때 초기화  할 생각을 했습니다. 처음에는 'src'속성값에 비어있는 값('')을 넣으려고 했습니다. 문득, 더 그럴싸한 게 없을까 하는 생각에 좀 더 찾아보니 'about:blank'을 넣어주면 된다는 것을 알았습니다. <iframe src="about:blank" frameborder="0"></iframe> 딱히 대단한 건 아닐 수 도 있지만 미처 생각하지 못하던 것이라 이렇게 적어봅니다.

Three.js 에서 대상을 멀리서 봤을 때 자글거리는 증상

이미지
Three.js를 사용하여 대상을 표현하는데 자글거리는 증상이 나옵니다. 카메라를 이동해서 가까이 가면 증상이 나오지 않지만 멀리 떨어지면 나오는 증상이었습니다. 대상을 구성하는 요소들이 겹치면서 자글거리는 것 같다고 생각이 들었지만 어떻게 처리해야 하는지 알 수 없었습니다. 그러다가 다음과 같은 글을 찾았습니다. https://github.com/jeromeetienne/AR.js/issues/401 댓글에 나와있는 답변에서 아래와 같은 내용을 봤습니다. var renderer = new THREE.WebGLRenderer({ antialias: true, alpha: true, logarithmicDepthBuffer: true }); 공식 문서에서 "WebGLRenderer" -> "logarithmicDepthBuffer" 항목을 찾아보니 다음과 같은 설명과 예시를 볼 수 있었습니다. https://threejs.org/docs/index.html#api/en/renderers/WebGLRenderer ( ctrl + f -> logarithmicDepthBuffer 검색 ) https://threejs.org/examples/#webgl_camera_logarithmicdepthbuffer 이 옵션은 깊이에 관련된 옵션으로 보였고, 옵션을 적용하니 문제는 쉽게 해결되었습니다.

닌텐도 스위치 유선랜 연결하기

이미지
닌텐도 스위치에 유선 인터넷을 사용하기 위해 검색을 했습니다. 호환되는 제품의 경우 ASIX 에서 만든 'AX88179' 라는 칩을 사용한 제품이면 된다고 하더군요. 하지만 여러 제품들 중에서 'AX88179'칩을 사용했다는 설명을 찾기가 어려웠습니다. 해당 칩을 사용하면 대충 USB3.0에 기가비트를 지원하는 성능이 나오는 것 같은데, 그런 제품들 중에는 리얼텍 제품이 많이 보였습니다. 찾아보다가 컴퓨존에 'AX88179'를 키워드로 검색하니 이 칩을 사용한다고 하는 제품이 있었습니다. 2019 07 17 캡쳐 가격이 택배비 포함하면 2만원 아래네요. 스위치 인터넷설정에 들어가 '유선 접속'을 선택하면 정상적으로 사용이 가능합니다. 독에서 빼면 알아서 무선으로 변경되고, 독에 넣으면 유선으로 자동 전환 됩니다. 중국 제품인 것 같은데 생각보다 깔끔하고 좋습니다.

Three.js 에서 카메라가 가까이 다가가면 특정 부분만 사라지는 경우

Three.js를 사용한 3D 공간에 캐릭터를 표시했습니다. 카메라를 이리저리 움직이며 보던 중에 가까이 접근하면 머리카락이 사라지는 증상을 알게 되었습니다. 이 문제를 찾아보기 위해 구글에 검색을 하니 비슷한 질문을 찾게 되었습니다. https://discourse.threejs.org/t/mesh-disapear-when-camera-close/2914 https://stackoverflow.com/questions/50501392/mesh-disapear-when-camera-close 보여지고 있는 object3D 객체의 "frustumCulled"값에 false를 넣으면 됩니다. 카메라에 보이지 않아도 렌더링 대상에 넣어주는 옵션으로 보입니다. https://threejs.org/docs/index.html#api/en/core/Object3D.frustumCulled 저는 mesh에만 적용하여 사용 했는데 소스는 다음과 같습니다. object3D.traverse(function (obj) { if (obj.isMesh) { obj.frustumCulled = false; } }); Object3D.traverse() 를 사용해 내부를 돌면서 mesh만 골라 "fustumCulled"를 설정하는 겁니다. 이렇게 하니 문제가 해결되었습니다. 이 문제는 애니메이션이 있는 대상에서 자주 일어난다고 합니다.