# Procedural galaxy and streaming

**URL:** <https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468>\
**Category:** Demos and projects\
**Created:** [June 19, 2024, 7:16pm UTC](https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468 "2024-06-19T19:16:10Z")\
**Posts on this page:** 20\
**Page:** 2

<div class="post-metadata">

**Author:** ![CrashMaster](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/crashmaster/32/23662_2.png) [@CrashMaster](https://forum.babylonjs.com/u/CrashMaster)\
**Post date:** [June 21, 2024, 7:59am UTC](https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468/21 "2024-06-21T07:59:39Z")

</div>

I get some flickering and color banding now (the video compression make it worse than it actually is)

---

<div class="post-metadata">

**Author:** ![plopidou](https://avatars.discourse-cdn.com/v4/letter/p/82dd89/32.png) [@plopidou](https://forum.babylonjs.com/u/plopidou)\
**Post date:** [June 21, 2024, 11:08am UTC](https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468/22 "2024-06-21T11:08:29Z")

</div>

Hey crashmaster, thanks, I will try and look into that.

Got this weird error, any idea?

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/a/b/ab9786e7b68a3afeebd9b70c07e6cbc1161b8190.png)

I think this might be due to the floating origin camera inheriting from FlyCamera. Making it inherit from UniversalCamera removes that error.

@Deltakosh maybe? 🙂

---

<div class="post-metadata">

**Author:** ![CrashMaster](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/crashmaster/32/23662_2.png) [@CrashMaster](https://forum.babylonjs.com/u/CrashMaster)\
**Post date:** [June 21, 2024, 12:59pm UTC](https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468/23 "2024-06-21T12:59:59Z")

</div>

I don’t have much experience on cameras beyond the FreeCamera and ArcRotateCamera unfortunately, this would need a PG reproduction 😕

---

<div class="post-metadata">

**Author:** ![plopidou](https://avatars.discourse-cdn.com/v4/letter/p/82dd89/32.png) [@plopidou](https://forum.babylonjs.com/u/plopidou)\
**Post date:** [June 21, 2024, 2:10pm UTC](https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468/24 "2024-06-21T14:10:31Z")

</div>

Ok I don’t like what I did but this:

```auto
class OriginCamera extends BABYLON.FlyCamera {
    constructor(name, position, scene) {
        super(name, BABYLON.Vector3.Zero(), scene);
        // start horrible hack
        this.inputs.attached.mouse._element = canvas;
        // end horrible hack
        <snip>

```

seems to fix it.

---

<div class="post-metadata">

**Author:** ![plopidou](https://avatars.discourse-cdn.com/v4/letter/p/82dd89/32.png) [@plopidou](https://forum.babylonjs.com/u/plopidou)\
**Post date:** [June 21, 2024, 4:46pm UTC](https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468/25 "2024-06-21T16:46:16Z")

</div>

ok now stars can be picked and display stuff similar to what can be found in the data explorer ([Ad Lumens - Data explorer](https://adlumens.org/data-explorer/)).

---

<div class="post-metadata">

**Author:** ![plopidou](https://avatars.discourse-cdn.com/v4/letter/p/82dd89/32.png) [@plopidou](https://forum.babylonjs.com/u/plopidou)\
**Post date:** [June 27, 2024, 8:59pm UTC](https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468/26 "2024-06-27T20:59:36Z")

</div>

Now satellites (==planets) can be viewed (they are an ugly grey for now!) and you get the details from them. 🙂

Am writing some blurb explaining the necessary changes related to this improvement.

---

<div class="post-metadata">

**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\
**Post date:** [June 30, 2024, 4:18pm UTC](https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468/27 "2024-06-30T16:18:41Z")

</div>

`camera.attachControl(true);`  
and you are good 🙂

---

<div class="post-metadata">

**Author:** ![plopidou](https://avatars.discourse-cdn.com/v4/letter/p/82dd89/32.png) [@plopidou](https://forum.babylonjs.com/u/plopidou)\
**Post date:** [June 30, 2024, 4:37pm UTC](https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468/28 "2024-06-30T16:37:21Z")

</div>

hey thank @roland.

I had done that, otherwise camera would’ve been a no go 🙂 I read somewhere that the flycamera hasn’t been upgarded in a while? Could that be related?

---

<div class="post-metadata">

**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\
**Post date:** [June 30, 2024, 5:02pm UTC](https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468/29 "2024-06-30T17:02:51Z")

</div>

The `FlyCamera` doesn’t support HTML element based input (when you move the camera by holding the left mouse button you can’t distinguish on which element you pressed the mouse button - this type of camera doesn’t need this feature)

I created a PR to fix the issue:

> <https://github.com/BabylonJS/Babylon.js/pull/15240>
>
> https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468/22

---

<div class="post-metadata">

**Author:** ![plopidou](https://avatars.discourse-cdn.com/v4/letter/p/82dd89/32.png) [@plopidou](https://forum.babylonjs.com/u/plopidou)\
**Post date:** [June 30, 2024, 8:00pm UTC](https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468/30 "2024-06-30T20:00:16Z")

</div>

sweet, thank you!🙂

---

<div class="post-metadata">

**Author:** ![plopidou](https://avatars.discourse-cdn.com/v4/letter/p/82dd89/32.png) [@plopidou](https://forum.babylonjs.com/u/plopidou)\
**Post date:** [June 30, 2024, 8:58pm UTC](https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468/31 "2024-06-30T20:58:57Z")

</div>

ok so related to an old post of mine ([Spherical coordinates / orbits - #5 by CrashMaster](https://forum.babylonjs.com/t/spherical-coordinates-orbits/46568/5)) the planets are now placed where they should be along their respective orbits.

Coming up (I hope) is … movement 😛

---

<div class="post-metadata">

**Author:** ![plopidou](https://avatars.discourse-cdn.com/v4/letter/p/82dd89/32.png) [@plopidou](https://forum.babylonjs.com/u/plopidou)\
**Post date:** [July 1, 2024, 9:05pm UTC](https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468/32 "2024-07-01T21:05:57Z")

</div>

Before movement, starting to apply a bit more material: planets are now lit by their stars. They are small, hunt for them! 😁

I need to find a way to highlight them…

---

<div class="post-metadata">

**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\
**Post date:** [July 2, 2024, 5:30am UTC](https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468/33 "2024-07-02T05:30:14Z")

</div>

> [@plopidou](#):
>
> They are small, hunt for them! 😁

I was about to report a bug that multiple stars are not moving then I realized I have to clean the fly shit (or whatever) outta my screen 😃 😃 😃

---

<div class="post-metadata">

**Author:** ![plopidou](https://avatars.discourse-cdn.com/v4/letter/p/82dd89/32.png) [@plopidou](https://forum.babylonjs.com/u/plopidou)\
**Post date:** [July 2, 2024, 1:33pm UTC](https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468/34 "2024-07-02T13:33:29Z")

</div>

I know I splutter all the time in front of my screen too 😝

---

<div class="post-metadata">

**Author:** ![plopidou](https://avatars.discourse-cdn.com/v4/letter/p/82dd89/32.png) [@plopidou](https://forum.babylonjs.com/u/plopidou)\
**Post date:** [July 7, 2024, 8:36pm UTC](https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468/35 "2024-07-07T20:36:01Z")

</div>

Hi all,

A small quality of life update:

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/5/3/5343fce4553ff5cbf1d8c357b73c96e2b093fa1b.jpeg)

Where close by stars and planets are now highlighted by some overlays, whose appearance changes with proximity:

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/0/4/0416467b117afd938e25f3485b417ece81a66463.jpeg)

Hope you will llike it 🙂

---

<div class="post-metadata">

**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\
**Post date:** [July 8, 2024, 12:54am UTC](https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468/36 "2024-07-08T00:54:14Z")

</div>

> [@plopidou](#):
>
> Hope you will llike it 🙂

Absolutely 😻

---

<div class="post-metadata">

**Author:** ![CrashMaster](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/crashmaster/32/23662_2.png) [@CrashMaster](https://forum.babylonjs.com/u/CrashMaster)\
**Post date:** [July 8, 2024, 7:27am UTC](https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468/37 "2024-07-08T07:27:48Z")

</div>

It’s very readable 👌 loving it!

---

<div class="post-metadata">

**Author:** ![plopidou](https://avatars.discourse-cdn.com/v4/letter/p/82dd89/32.png) [@plopidou](https://forum.babylonjs.com/u/plopidou)\
**Post date:** [July 10, 2024, 4:43pm UTC](https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468/38 "2024-07-10T16:43:58Z")

</div>

another update probably coming online tonight, in spite of a major problem: moons & rings.

still no texture or movement, though…

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/b/f/bf88ac0378eae77e4362bc9736d8dbc306dfd3af.jpeg)

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/b/2/b2b163a17a5881a388918770b8767cf0d14cb850.jpeg)

the “debug” are for dumping useful stuff to the console on local 😃

the major problem: precision. I will try to explain what the problem is one of those posts…

---

<div class="post-metadata">

**Author:** ![CrashMaster](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/crashmaster/32/23662_2.png) [@CrashMaster](https://forum.babylonjs.com/u/CrashMaster)\
**Post date:** [July 11, 2024, 7:12am UTC](https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468/39 "2024-07-11T07:12:08Z")

</div>

Precision is always the big hurdle for space scenes, do you use floating origin?

---

<div class="post-metadata">

**Author:** ![plopidou](https://avatars.discourse-cdn.com/v4/letter/p/82dd89/32.png) [@plopidou](https://forum.babylonjs.com/u/plopidou)\
**Post date:** [July 11, 2024, 7:15am UTC](https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468/40 "2024-07-11T07:15:48Z")

</div>

I do use it, yeah.

But only “one layer” deep.

So my problem is the following:

. systems (and so stars) are origin entities  
. stars are instances, children of systems  
. planets are transform nodes, as children of systems  
. satellites/rings are transform nodes, children of planets

It all works nicely, until the coordinates _inside_ and origin entity starts to suffer from precision loss. It’s especially apparent for:  
. planets far away from the OE origin  
. moons far away from planet origin

Any idea on how to improvce this?

[Previous page](https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468.md?page=1)

[Next page](https://forum.babylonjs.com/t/procedural-galaxy-and-streaming/51468.md?page=3)
