Need Help with Orbit Control three js and troisjs in nuxt app

[icy hill]

Nuxt Version: v3.5.2
Three Version : v0.134.0
Troisjs Version: v0.3.4

I'm working on Nuxt App, I've created a component which imports a 3D model using gltf to be precise, I need help with orbit control.

I'm trying to do is block any vertical (y-axis) movement in orbit control, i don't want 3D model to tilt upwards or downwards, i only want to allow left and right (x-axis) movement.

Here is the code of the componenet pcSetup.vue

<script lang="ts" setup>
import {
    Camera,
    Renderer,
    Scene,
    RendererPublicInterface,
    AmbientLight,
    GltfModel,
    DirectionalLight
} from 'troisjs';
const rendererC = ref<RendererPublicInterface>()

</script>

<template>
    <Renderer :orbit-ctrl="{enableZoom: false, rotateZ: false, rotateY: false}" ref="rendererC" resize="window" :alpha="true">
        <Camera :position="{x: 12, y: 3, z: 0 }" :fov="50" />
        <Scene>
            <AmbientLight :intensity="2" />
            <DirectionalLight :position="{ x: 12, z: 50, y: 3 }" :intensity="1" />
            <GltfModel :size="3"  src="/pc/scene.gltf" :position="{ x: 0, y: -2, z: -1.5}" />
        </Scene>
    </Renderer>
</template>

Image of the 3D model i'm trying to implement in the app

This is the type of movement I'm trying to configure for my 3D model: https://johnsondebbie.com/

[bleak rivet]

set the min & max polar angle to the same value ?

https://threejs.org/docs/index.html?q=orbitc#examples/en/controls/OrbitControls.minPolarAngle

[icy hill]

I don't know how can i put those attributes in with Troisjs tho, this is my first time using troisjs for three js, i'm not sure how to access those property in troisjs

[bleak rivet]

Like you passed enableZoom : false , try passing minPolarAngle : 0

[icy hill]

thank you so much, it's working now

[errant lynx]

It looks like troisjs is not maintained any longer, I saw people say it cannot be used with latest three due to some breakage. If that’s so than Orbit controls is your least problem. Have you seen tresjs?

[icy hill]

Nope, i didn't tried tresjs yet, problem has been resolved and it's true we cannot use new version of three js with troisjs, so i'm using old version of three js

[errant lynx]

Imo that’s a real risk, you’ll bind an application to the demise of a library.