본문 바로가기

전체 글156

부동소수점 오류 현상 부동소수점 오류 현상 const a = 0.1; const b = 0.2; console.log(a+b); // 0.30000000000000004 소수점이 있는 실수를 이진수로 표현할 때 이진수로 표현하지 못하는 소수가 발생하여 컴퓨터는 가장 근사치의 값이 저장된다. 고정 소수점 또는 부동 소수점 을 사용해 이를 해결한다. 부동 소수점을 표현하는 방식으로 일반적으로 IEEE에서 표준으로 제안한 방식을 사용한다.( 부호비트(1bit), 지수비트(8bit), 가수비트(23bit) ) 하지만 부동 소수점 계산에는 정밀도가 손실되고, 반올림으로 오차가 생기는 오류가 발생한다. 부동 소수점 오류를 해결하기 위한 방법으로 - toFixed() 사용 - Math 객체의 메서드 사용 - 기타 라이브러리 사용 (Big.. 2024. 3. 8.
3D를 위한 삼각함수 기초 3D를 위한 삼각함수 기초 sinθ = θ에서 직각까지 빙돌아서tanθ  = θ에서 직각까지 바로 간 다음에 뚫린 길로cosθ = 빗변에서 시작해서 θ를 사이에 두고 tanθ = sinθ / cosθ  특수각의 삼각비 30도45도60도sin$$  \frac{ 1 }{2} $$$$  \frac{ \sqrt{2} }{2} $$$$  \frac{ \sqrt{3} }{2} $$cos$$  \frac{ \sqrt{3} }{2} $$$$  \frac{ \sqrt{2} }{2} $$$$  \frac{ 1 }{2} $$tan$$  \frac{1} { \sqrt{3} } $$$$  { 1 } $$$$  { \sqrt{3} } $$ 라디안라디안은 호의 길이로 각도를 나타내는 방법이다.각도를 실수로 표현하기 위해 사용한다... 2024. 2. 17.
Three.js 설치(번들러 없이) Three.js 설치(번들러 없이)Three.js 는 모듈 방식으로 개발하는 것을 권장한다.three.js에서 공식적으로 webpack이나 vite같은 번들러의 이용을 권장하고 있고,  공식 문서도 번들러의 사용을 전제로 작성되어 있다. 아래의 설치 방법은 번들러를 사용하지 않은 방법이다.번들러를 사용하지 않기 때문에 폴더의 경로를 직접 지정해줘야 하는 번거로움이 있다.importmap을 사용하여 그 번거로움을 해결한다.1. npm 명령어 이용하여 설치1.1 node_moduls/three/build 폴더에서 three.module.js 가져오기npm install threeThree.js를 불러오기 위해서는 폴더의 경로를 지정해 주어야 한다. 하지만 Three.js의 다양한 모듈(controls, lo.. 2024. 2. 12.
금액 입력 input 구현 금액 입력 input 구현 기능 리스트 1. 마이너스를 포함한 정수만 입력한다. 2. 입력한 숫자에 천단위 콤마를 찍는다. 3. 숫자들이 입력되면 합계 계산을 한다. 구현 정책 1. input에 포커스 될 때 1.1. input에 0 이 있으면 지운다. 1.2. input에 0 외에 값이 있으면 천단위 마다 있는 콤마를 지운다. 2. input에 포커스가 빠져나올 때 2.1. 마이너스만 있으면 0 으로 세팅 2.2. 천단위 마다 콤마를 넣는다. 3. input이 keyup 될 때 3.1. 마이너스와 숫자를 제외한 문자열이 입력되지 않도록 한다. 3.2. 마이너스가 문자열의 두번째 이후에 있으면 지운다. 3.3. 입력값이 마이너스 부호만 있는 경우를 제외하곤 합계 계산을 한다. See the Pen inp.. 2023. 12. 29.
Material Symbols, Material Icons 사용 방법 Material Symbols, Material Icons 사용 방법 Material Symbols, Material Icons 차이점https://fonts.google.com/icons 에 들어가면 아이콘의 스타일이 Material Symbols(default) 와 Material Icons으로 나뉘어져 있다. 이 둘 모두 구글의 공식 아이콘 세트이다.Material Icons는 클래식 세트인 반면 Material Symbols는 가변 글꼴 기술을 기반으로 2022년 4월에 도입되었다. Material Symbols 는 세 가지 스타일과 4가지의 조정 가능한 가변 글꼴 축 (채우기, 두께, 등급, 광학 크기)으로 제공된다. 아래는 현재 Material Icons에서 사용할 수 없는 기능이다.varia.. 2023. 12. 28.
noto sans 웹폰트 다운로드 사용 방법 noto sans 웹폰트 다운로드 사용 방법 cdn을 걷어내기 위해 웹폰트를 다운로드하여 사용하게 되었다.아래 글은 그 여정을 돌아보며 특별히 noto sans kr 웹폰트 사용 방법을 정리한 내용이다. noto sans 웹폰트를 어디서 다운로드 받아야 하는지,어떤 파일타입을 받아야 하는지,css에 폰트 설정을 어떻게 해야 하는지위 세 가지를 중점으로 살펴 본다. 먼저 웹에서 사용하는 폰트는압축률이 좋은 woff2 혹은 모든 브라우저에서 지원하고 w3에서 추천하는 woff 타입을 사용해야 한다.뒤에서 다시 살펴 보겠지만,@font-face src 속성에 적을 때도 woff2 url를 먼저 적고 그 다음 woff url을 적는다. woff2, woff 타입으로 noto sans kr 다운로드1차시도 구글 .. 2023. 12. 28.

티스토리툴바