Hi all - I’ve not used Three.js/R3F/etc before so forgive me for not having a MWE, I was just trying to solve a problem and someone suggested it could be solved in the Three.js ecosystem - hopefully someone can confirm or deny its suitability. I’m trying to recreate this effect , or the left-to-rig…

Forgot to add to the main post - I’ve seen some talk of perspective cameras in Three in my searching, I’m just not sure if it’s possible to do something like the above. Thanks again!

This is definitely something you could do with threejs and some shaders. It’s not the easiest starting point/introduction to threejs but totally possible with some help. For instance… you could use a Box with the camera placed inside it, then use the vertex shader to animate the UVs (texture coordi…

Look here and here . If I good remember, one of @prisoner849 Codepen is exactly what you looking for, I am pretty sure that I have seen here that. I mean that infinite grid…

[image] Lukasz_Mestales: If I good remember, one of @prisoner849 Codepen is exactly what you looking for, I am pretty sure that I have seen here that. I mean that infinite grid… https://codepen.io/prisoner849/full/MWMLOVK In my Collection 2024 eXtended eXamples [2024-12-02 09.04.26] In…

I think @manthrax ’s suggestion of using scrolling UVs inside a cube is likely the best approach for your needs. That said, this might not be exactly what you’re looking for, but it could be a helpful starting point as it handles the infinite cube shader well: [image] Repeat textur…

Maybe one box with changed shader which contain 10 textures for one draw calls. Or more easy 10 boxes then 10 draw calls. Also maybe need to stretch UV to cover box 4 sides with range 0.0-1.0. Then first side will be have range 0.0-0.25, second 0.25-0.5, third 0.5-0.75, fourth 0.75-1.0.

Asked myself whether it is possible to do the effect without custom shaders, without custom UVs, without custom dealing with buffer attributes. This is what I got: https://codepen.io/boytchev/full/WbevzJj [image] PS. I do not say this is the way to go, I just explore one alternative

[image] PavelBoytchev: Asked myself whether it is possible to do the effect without custom shaders, without custom UVs, without custom dealing with buffer attributes. I stopped at shader part :sweat_smile:, and created a bent plane geometry with continues UVs. Edit fiddle - J…

It is even possible without modifying the texture. Here is illustration of two “images” crossing each-other synchronously (first row is how it is done; second row is how it looks like). The gray wall hides the undesired parts of the images. [image]

I’m a bit late to the party, with the same thought of the using of CylinderGeometry. Picture: [изображение] Demo: https://codepen.io/prisoner849/full/qEWdYga

Infinite marquee across a dynamic perspective? Is it possible in Three?

Questions

prisoner849 December 2, 2024, 2:51pm 11

I’m a bit late to the party, with the same thought of the using of CylinderGeometry.

Picture:

Demo: https://codepen.io/prisoner849/full/qEWdYga

Topic		Replies	Views
I want this shapeless infinity scroll like this site https://www.barlow.agency/ using three.js canva. anyone pleas helped me! https://www.barlow.agency/ Questions animation	3	714	November 3, 2023
Infinite rendering of objects on scroll Questions 3d-applications , interaction	6	3354	January 18, 2024
I want this shapeless infinity mouse drag card gllary effect with each card should be title and desc, see on the attached link i want like this hover with text https://www.barlow.agency/ Questions textures , loaders , geometry , animation	13	882	April 11, 2025
Shall I use textures or planes to create this effect? Questions textures , geometry	12	1158	March 26, 2019
Texture animation based on camera perspective Questions textures , materials , animation	2	344	July 28, 2023

Infinite marquee across a dynamic perspective? Is it possible in Three?

Related topics