728x90 반응형 webgl기초2 [Webgl] webgl을 이용한 삼각형 만들기 WEBGL을 이용하여 삼각형을 만들어보자 index.html index.html 파일을 생성하고 그안에 body와 canvas를 만들자. webgl은 canvas안에 그림을 그린다. body 태그안에 정의한 onload이벤트 핸들러는 webglstart()메서드를 호출한다. 현재는 webglstart함수가 없기에 에러가 뜰것이다. onload이벤트는 유저가 브라우저를 통해 웹 페이지에 진입하고 모든 소스 코드의 내용을 완전히 로딩하면 onload이벤트를 시작한다. canvas안에 id 값을 넣어줌으로써 자바스크립트 코드로 접근이 용이하도록 만들어 놓는다. script문을 열고 webglstart 함수를 생성! document.getElementById를 통해 일전에 canvas에 넣어놓았던 id값을 가져.. 2020. 11. 10. 웹지엘 ? WebGL ?? 기본원리-2 웹지엘 그래픽 파이프라인 웹지엘 그래픽 파이프라인은 아래 순서와 같다. (웹 애플리케이션 HTML + CSS + 자바스크립트 + 셰이더 소스코드 + 3차원 모델링 데이터) ->웹지엘(자바스크립트 API) -> 버텍스 셰이더 -> 프리미티브 어셈블리 -> 레스터화 -> 프래그먼트 셰이더 -> 가위테스트 ->멀티샘플 프래그먼트 연산 ->스텐실 테스트 -> 깊이 버퍼 테스트 -> 블렌딩 -> 디더링 ->그리기 버퍼 이중 사실 웹지엘 프로그래머에게 가장 중요한 단게는 버텍스 셰이더와 프래그먼트 셰이더이다. 버텍스 셰이더 (웹 애플리케이션 HTML + CSS + 자바스크립트 + 셰이더 소스코드 + 3차원 모델링 데이터) ->웹지엘(자바스크립트 API) -> 버텍스 셰이더 -> 프리미티브 어셈블리 -> 레스터화 -.. 2020. 11. 6. 이전 1 다음 728x90 반응형
