Angular Three.js

Integrate 3Lens with Angular applications using dependency injection.

Angular Three.js Demointermediate

Loading example...

Use 3Lens with Angular through a dedicated service. Leverage RxJS observables for reactive debugging.

Features Demonstrated

• Angular Service: Injectable 3Lens service
• RxJS Integration: Observables for probe events
• Component Lifecycle: Proper setup and teardown
• Zone.js Awareness: Works with Angular change detection

Usage

import { ThreeLensService } from '@3lens/angular-bridge';

@Component({...})
export class SceneComponent implements OnInit, OnDestroy {
  constructor(private threeLens: ThreeLensService) {}
  
  ngOnInit() {
    this.threeLens.observeRenderer(this.renderer);
    this.threeLens.observeScene(this.scene);
  }
  
  ngOnDestroy() {
    this.threeLens.dispose();
  }
}

Related Examples

• Vanilla Three.js - Basic setup
• React Three Fiber - React integration