Hey there,
I am using views to display different 3d models. It was discussed here.
When using it in combination with Center.jsx from react three drei it looks like some objects of my model moving around.
I load the model itself like this:
return <Center
animations={animations}
cacheKey={url}
>
<mesh ref={meshRef}>
<primitive ref={ref} object={copiedScene} {...props}>
{children}
</primitive>
</mesh>
</Center>
Then the parts are moved away:
When doing the same without the centering:
return <mesh ref={meshRef}>
<primitive ref={ref} object={copiedScene} {...props}>
{children}
</primitive>
</mesh>
The results are the following:
As you can see, the elements are nearly on the correct location.
When using a Canva instead of views, it works fine as well. How to position the specific element directly on the correct location? (I don’t know the 3d model, that will be uploaded and displayed).
You can find a reproduction here.