[three.js] three.js 특정 도형 마우스 클릭 시 툴팁(tooltip) 출력되도록 구현하기 검색 결과
1 개의 검색 결과가 있습니다.
IT/Three.js

[Three.js] Three.js 특정 도형 마우스 클릭 시 툴팁(Tooltip) 출력되도록 구현하기

Three.js를 사용하여 WMS  창고 시각화를 하고 있는데, 특정 rack에 저장되어 있는 bin 객체(박스 형태)를 클릭하면 해당 객체에 어떤 sku, 개수 등을 가지고 있는지 툴팁(Tooltip)을 출력되도록 구현하는 방법에 대해 기록한다.Three.js 특정 도형 마우스 클릭 시 툴팁(Tooltip) 출력되도록 구현하기먼저, 개발해야 하는 방향에 대해 설명을 한다. ① 해당 객체를 생성할 때 해당 객체에 데이터를 넣는다.② Three.js 라이브러리에서 제공하는 rayCaster와 Mouse의 Vector를 정의한다.③ rayCaster의 Mouse 위치의 Vector를 계산하여 교차하고 있는 그 위치의 도형 데이터를 가져온다.④ 도형 데이터를 가져와서 툴팁을 생성한다. 툴팁 생성 시 위의 방향..

2025. 3. 18.