본문 바로가기

분류 전체보기321

openGL 과, WebGL 기초 공고를 열심히 뒤져보니 2D나 3D 벡터 그래픽을 표현할 때 많이 사용되는 라이브러리 같기에 알아보고자 한다. 대표적인 그래픽스 라이브러리로는 OpenGL과 DirectX 가 있다고 함. OpenGL Open Graphics Library 의 약자로 C언어 기반 GPU를 이용한 하드웨어 가속화를 통해 렌더링 하며 주로 데스크탑 어플리케이션 등에 사용된다고 한다. 가상현실, 시각화, 비디오 게임 등... WebGL Web Graphics Library 의 약자로 OpenGL ES2 에서 파생 웹GL은 자바스크립트를 기반으로 HTML Canvas에 2D, 3D를 표현하는 역할을 한다. OpenGL에서 파생되어 OpenGL의 기능들을 웹에서 표현한다고 함 다만 WebGL은 OpenGL의 모든 기능을 지원하지는.. 2023. 6. 9.
노마드코더 JS로 그림 앱 만들기 - 2 그림판의 다양한 기능 추가하기 input 필드의 range 타입을 이용하여 브러쉬의 굵기 지정해주기 const lineWidth = document.querySelector('#line-width'); ctx.lineWidth = lineWidth.value; function onLineWidthChange(evt) { ctx.lineWidth = evt.target.value; } lineWidth.addEventListener('change', onLineWidthChange); 추가로 위처럼 굵기를 지정해주면, 선이 그려질때마다 같은 경로를 참조하고 있으므로 굵기가 변하는 버그가 생긴다. 이를 위해서 마우스가 Up 되거나 leave 될 때 컨텍스트를 beginPath() 해준다. 선의 색 바꿔주기 .. 2023. 6. 9.
노마드코더 JS로 그림 앱 만들기 - 1 초기 설정 // index.html app.js / index.html / styles.css 파일 생성 live sever 확장 프로그램 설치 ❗️ canvas 란? https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API Canvas API - Web APIs | MDN The Canvas API provides a means for drawing graphics via JavaScript and the HTML element. Among other things, it can be used for animation, game graphics, data visualization, photo manipulation, and real-time video p.. 2023. 6. 8.
노마드코더 Dart Begginer - 4 Class 선언 class 키워드를 사용하여 선언 class 클래스명 { 타입명 변수명 = 초기값; } 함수의 지역 변수의 경우 타입을 var 로 사용해줄 수 있었지만 클래스의 경우 프로퍼티를 선언할 때 타입명을 꼭 지정해줘야 한다! 여기서 late, final, const 등을 사용해준다. 메서드의 경우, 다른 객체 지향 언어에서 클래스 내의 변수에 접근할 수 있는 this 등은 사용하지 않는 것을 권고하고 있음. 다만, 함수 내에서 동일한 지역 변수명이 된다면 클래스에 접근하기 위한 this 사용은 가능함. class Player { final String name = 'nico'; int xp = 22; void sayHello() { print('Hello, My name is $name'); /.. 2023. 6. 7.

티스토리툴바