Skip to content

Commit 33d5de7

Browse files
authored
Merge pull request #771 from stefanpl/patch-3
Add rxjs example
2 parents 223ae62 + 3711d5a commit 33d5de7

File tree

1 file changed

+38
-0
lines changed

1 file changed

+38
-0
lines changed

content/features/featuresDeepDive/events/observables.md

+38
Original file line numberDiff line numberDiff line change
@@ -302,3 +302,41 @@ scene.onPointerUp = () => {
302302
advancedTimer.stop();
303303
}
304304
```
305+
306+
## Usage with RxJS
307+
308+
[RxJS](https://rxjs.dev/) is a common library for handling Observables which are compliant with the [current ECMAScript Observable proposal](https://github.com/tc39/proposal-observable#ecmascript-observable). It provides a wide range of operators, allowing for advanced execution patterns.
309+
310+
The following (TypeScript) code can be used to convert a Babylon Observable into its RxJS equivalent:
311+
312+
```typescript
313+
/**
314+
* Wraps a Babylon Observable into an rxjs Observable
315+
*
316+
* @param bjsObservable The Babylon Observable you want to observe
317+
* @example
318+
* ```
319+
* import { Engine, Scene, AbstractMesh } from '@babylonjs/core'
320+
*
321+
* const canvas = document.getElementById('canvas') as HTMLCanvasElement
322+
* const engine = new Engine(canvas)
323+
* const scene = new Scene(engine)
324+
*
325+
* const render$: Observable<Scene> = fromBabylonObservable(scene.onAfterRenderObservable)
326+
* const onMeshAdded$: Observable<AbstractMesh> = fromBabylonObservable(scene.onNewMeshAddedObservable)
327+
* ```
328+
*/
329+
export function fromBabylonObservable<T>(
330+
bjsObservable: BJSObservable<T>
331+
): Observable<T> {
332+
return new Observable<T>((subscriber) => {
333+
if (!(bjsObservable instanceof BJSObservable)) {
334+
throw new TypeError("the object passed in must be a Babylon Observable");
335+
}
336+
337+
const handler = bjsObservable.add((v) => subscriber.next(v));
338+
339+
return () => bjsObservable.remove(handler);
340+
});
341+
}
342+
```

0 commit comments

Comments
 (0)