Hi!
Another thin instances stuff. I was a member of the Amiga Demo Scene back in 1993-1998 (if I remember correctly) and we did a lot of cool stuff just for fun. I’ve created a Tower scroller back then so I tried to mimic it in BabylonJS using thin instances (this one is using cubes as prefabs). It is looking pretty close to the Amiga version, however there was no free camera movement back then of course 
You can customize the text, use {{ }} for changing the color of the text.
// {{r,g,b,a}}
const text = "{{255,255,255,255}}Welcome to The {{250,250,0,255}}Towers of Babylon{{100,0,0,255}} 3D Text Scroller{{0,0,255,255}}, another thin instances demo created by {{40,40,40,1}}Roland Csibrei{{0,0,255,255}}... You can try to change this text and the {{0,255,255,255}}calculatePosition(){{0,0,255,255}} method to create cool scrollers... Give it a try! "
Sorry, the smiley at the beginning is hard coded.
This method does the mapping from 2D text pixels to 3D coordinates:
calculatePosition(baseX, baseY, width, color) {
const radiusMax = 70
const multiplier = 3
const radius = radiusMax // - baseX / 80
const radiusDividerRatio = 2
const divider = radius * radiusDividerRatio
const x = (-Math.cos(baseX / (width / divider)) * radius) * multiplier
const y = (baseY + baseX / 10) * multiplier
const z = (Math.sin(baseX / (width / divider)) * radius) * multiplier
const r = color.r
const g = color.g
const b = color.b
const a = color.a
return { x, y, z, r, g, b, a }
}
You can change the rotation and the camera movement in the setupCamera method:
const rotationPositionRatio = 26
const rotation = 0.01
const moveY = rotation * rotationPositionRatio
scene.onBeforeRenderObservable.add(function () {
cameraParent.rotation.y -= rotation
cameraParent.position.y -= moveY
});
Cheers!
R.
