Question: Scrolling lists

[PhilAndrew]

Hello, I have a bunch of questions about what is possible and what would be a good way to go about doing it, ie, can it be done, if so what direction to take?

Regarding this demo https://codesandbox.io/s/yjhzv?file=/src/App.js

1. Could I have more than one scrolling list in the page, currently this whole page scrolls, could I have for example 4 rectangular areas with scrolling items in their boxes and a scrollbar beside each of them, on one single page?
2. Can pixel perfect images be placed in the list of items being scroll, what I mean by pixel perfect is a pixel in the image should map directly to the screen 1-to-1 even though the image is on a plane in 3D space, that means the plane and camera are aligned correctly so that the image displays as it would if it was on a 2D surface such as a webpage. The plane is still in a 3D space and if the plane was moved away, it and the image would get smaller and it wouldn't be pixel perfect.
3. I would like to make an infinite/very large scrolling list, with items which are recycled as the user scrolls, any suggestion ? The reason is that I wish to allow the user to scroll a large number of records in a database, but render those results as the user scrolled, so I would recycle items back to the top as they scrolled it

[drcmda]

You could have 4 canvas, that should work.

Images are pixel perfect when the source ratio is correct, i would use a regular plane instead of the image component.

Infinite scroll would be the same as on the dom. Perhaps if you detect offset 1 you could set scroll top to 0. Though you would loose momentum, but there has to be a solution for it. Generally, it's just a regular scroll area.

[drcmda]

ok, i implemented infinite scroll, but it only works without damping, i would need some help here: https://codesandbox.io/s/scrollcontrols-demo-website-forked-x8gvs?file=/src/ScrollControls.tsx:2729-3215

damping is set to 100 for this one, so it's instant. with a slow value (try 4) it breaks the illusion.

edit: turns out i have to add/subtract the left over dampened value and that seems to fix it.

[svenvoskamp]

I also have a few questions about the scroll lib:

1. Is it possible that you can vertical scroll with your mouse on the horizontal scroll?
2. Can you combine vertical and horizontal scroll sections?
3. The infinite scroll is flickering and glitching for me.

For the rest, the library works perfect! Great work :)

[drcmda]

im pretty bad at css and dom, someone will have to make it work/look into it. the basis (0-1 scroll) works quite well for now, these extras, i don't think im able to do it.

the file can be copied into a project locally: https://github.com/pmndrs/drei/blob/master/src/web/ScrollControls.tsx and it's still quite readable. if you find something please pr it.