Leon's Lab

폴리곤 객체 삼각뿔 띄워보기  vtkActor, vtkMapper 등등은 기본적인 VTK 사용방법 그대로 사용하면 됩니다.  VTK.js에서 다른 점은 renderer와 renderwindow를 설정할때인데, VTK는 생성해서 사용했지만 여기서는  vtkGenericRenderWindow에서 미리 생성된 값을 받아와서 설정해줘야 한다는 것입니다.    결과 화면이상입니다. Quasar에서 VTK.js 시작하기 - 1 : https://dev-leon.tistory.com/76Quasar에서 VTK.js 시작하기 - 2 : https://dev-leon.tistory.com/77Quasar에서 VTK.js 시작하기 - 3 : https://dev-..

개요VTK.js를 설정하여 빈 화면 출력을 해보겠습니다. Vue에서 유명한 UI 라이브러리인 Quasar를 이용하여 전체적인 레이아웃을 잡도록 하겠습니다.Quasar를 설치하는 것은 다음글(https://dev-leon.tistory.com/57)을 참고 하세요. 순서 1. Quasar 설치(설치글을 보고 설치 진행) 2. VTK.js 설치     - VSCode 터미널 창에서 설치된 프로젝트 디렉토리로 이동     - $npm install @kitware/vtk.js     참조 : https://kitware.github.io/vtk-js/docs/vtk_vue.html   3. 참고 사항     - Typescript를 이용하여 개발함.     - vtkGenericRenderWindow를 이용하..

vue3, quasar, typescript를 이용한 프로젝트에서 vtkGenericRenderWindow를 이용하여 화면을 html 요소의 배치에 맞게 크기 설정하기  A B C  결과화면

Colormap을 사용하는 이유 Colormap은 수학적인 결과를 색상으로 보고자 할때 많이 사용한다. 예를 들어 가우시안 곡률을 색상으로 보면 한눈에 개략적인 상황파악이 쉬워지고, 결과적으로 작성한 코드의 수식을 디버깅하기 용이해진다. Colormap에 대하여 Colormap은 0.0 ~ 1.0에 해당하는 값을 출력해주는 기능으로써 float N개짜리 vector를 넣어주면 N행 3열짜리 매트릭스 를 반환하는데 각 행에는 RGB값을 0.0 ~ 1.0 값으로 표현된 형태로 들어 있음. Colormap은 색상분포가 종류별로 많은데, 기본적으로는 RGB를 잘 섞은 Turbo 타입이 무난한거 같음 각 정점에 0.0 ~1.0 값에 해당하는 컬러맵을 대입해서 출력한 결과는 아래와 같음 Colormap 사용 방법 ..

Light On Off 설정 viewer.core().lighting_factor 의 값을 0 ~ 1 사이값을 넣으면 얼마나 빛의 영향을 받을지 설정 가능함 수학적인 결과만을 보고자 할때는 빛의 영향을 받지 않는 순수한 색상만 보고 싶을때가 있는데 이때 사용하는 옵션

이벤트 처리는 Viewer 단계에서 처리함 이벤트 함수가 미리 정의되어 있는데, 해당 함수를 교체하는 방식으로 사용. 아래의 예시는 Mesh위에서 마우스 클릭했을때, 클릭한 위치의 Face ID와 Vertex ID를 알려주는 구문 #include bool mouse_down(igl::opengl::glfw::Viewer& viewer, int button, int modifier) { // 클릭한 메시의 Face ID와 가장 가까운 Vertex ID 알려주는 구문 int fid; Eigen::Vector3f bc; double x = viewer.current_mouse_x; double y = viewer.core().viewport(3) - viewer.current_mouse_y; if (igl::..

이전 글(libigl 시작하기)에서 libigl을 설치하고 예제를 돌려보았다면 나만의 프로젝트를 시작해 보자. 목표 libigl을 이용하여 내프로젝트를 만들기. 추가 목표 빠른 컴파일을 위한 환경 설정 : 원래 libigl은 header 파일만 있으면 사용할수 있어서, 사전 빌드과정이 필요는 없다. 하지만 이 방식을 사용하면 코드 한 줄을 고칠때마다 전체 빌드를 해야 하므로 개발할때 답답해진다. 코도 한줄 고치고 20초간 컴파일한다고 생각하면 개발이 너무 지루해진다. 그래서 이전글을 참고해서 빌드를 했다면 정적 라이브러리 파일이 하나 생성되는데 해당 라이브러리파일을 이용하여 빌드시간을 줄이는 환경을 설정하면 개발이 편해진다. 선행조건 개발툴 : Visual studio 2022 Community libi..

libigl(https://libigl.github.io/) 이란? 3D Mesh Processing and Visualiztion Library로써 3차원 폴리곤 데이터 처리 알고리즘 및 뷰어를 제공해주는 라이브러리 libigl(2.4.0)가 제공하는 기능 - Geometric Operators : Curvature, Gradient, Laplacian, Geodesic, Deformation, Remeshing 등등의 알고리즘 제공 - Visualization : OpenGL 기반의 랜더링 뷰어 제공 - 외부 라이브러리 추가 포함 : CGAL 등등의 외부 라이브러리도 추가적으로 포함되어 있어서 확장성이 좋음 라이선스 - https://libigl.github.io/license/ 기본적인 사항들은 M..

서버 전송의 대략적인 절차 FILE -> Blob(application/octet-stream) -> 서버 전송 -> 서버에서 데이터 확인 writeImageArrayBuffer함수를 사용하면 ArrayBuffer형태로 데이터가 나옴(아마도 VTI 포멧같음) ArrayBuffer : 특정 크기의 데이터를 저장하는 Array. C언어에서 이야기하는 Array. 해당 데이터를 서버로 전송하고자 하는데, Blob로 감싸서 보내야 하는건지...... Blob은 MIME 타입을 어떻게 지정해야 하는건지 application/octet-stream : 8bit binary 데이터