New file |
| | |
| | | import * as THREE from 'three'; |
| | | import { CSS2DRenderer } from 'three/examples/jsm/renderers/CSS2DRenderer'; |
| | | export default class CSSRenderer { |
| | | constructor(experience) { |
| | | this.experience = experience; |
| | | this.container = experience.container; |
| | | this.canvas = experience.canvas; |
| | | this.sizes = experience.sizes; |
| | | this.scene = experience.scene; |
| | | this.camera = experience.camera; |
| | | |
| | | this.setInstance(); |
| | | } |
| | | setInstance() { |
| | | this.instance = new CSS2DRenderer(); |
| | | this.instance.setSize(this.sizes.width, this.sizes.height); |
| | | this.instance.domElement.style.position = 'absolute'; |
| | | this.instance.domElement.style.top = '0px'; |
| | | this.instance.domElement.style.left = '0px'; |
| | | this.instance.domElement.style.pointerEvents = 'none'; |
| | | this.container.appendChild(this.instance.domElement); |
| | | |
| | | } |
| | | resize() { |
| | | this.instance.setSize(this.sizes.width, this.sizes.height); |
| | | this.instance.setPixelRatio(this.sizes.pixelRatio); |
| | | } |
| | | update() { |
| | | this.instance.render(this.scene, this.camera.instance); |
| | | } |
| | | |
| | | destroy() { |
| | | this.instance.domElement.remove(); |
| | | } |
| | | } |