ThreeJsPin

ThreeJsPin is a PinAdapter for the Contextual Comments component and allows you to integrate Contextual Comments into a Three.js application.

How to use

To initialize the ThreeJsPin you can follow our quickstart guide.

Usage

Before creating the Comments component, you will need to initialize the ThreeJSPin adapter. You will need to pass the scene, renderer, and camera object from your ThreeJS initialization.

import { ThreeJsPin } from "@superviz/threejs-plugin";

// Creating a ThreeJSPin adapter
const pinAdapter = new ThreeJsPin(scene, renderer, camera, player);

Properties

The table below shows the arguments passed on the constructor object:

Name	Type	Description
scene	Scene	Required. The ThreeJS scene object, already loaded.
renderer	Renderer	Required. The Renderer in Three.js is responsible for drawing the 3D scene onto a 2D canvas in the web browser. It takes the scene and camera as inputs and uses WebGL (via WebGLRenderer) to produce hardware-accelerated graphics. The Renderer is created at the start of a Three.js application and its render() method is called each frame to update the view.
camera	Camera	Required. The ThreeJS scene’s camera, previously created.
player	Object3D	Optional. The 3D object you want your avatar to be added to. For first-person experiences you can use cameras object here. If no player is provided, we’ll use the camera.
controls	OrbitControls	Required if using OrbitControls. The ThreeJS OrbitControls object, previously created.