CameraControls not working

Tresjs / cientos

Collection of useful helpers and fully functional, ready-made abstractions for TresJS

https://cientos.tresjs.org/

MIT License

278 stars 40 forks source link

CameraControls not working #341

Closed Sea-DH1 closed 7 months ago

Sea-DH1 commented 7 months ago

Describe the bug

CameraControls not working, Scene cannot be interacted with.

Reproduction

https://stackblitz.com/edit/vitejs-vite-eg7wqt

Steps to reproduce

No response

System Info

system:
    OS: windows
    CPU: (8) x64 Intel(R) Core(TM) i7-8700 CPU @ 3.2GHz
    Memory: 0 Bytes / 0 Bytes
  Binaries:
    Node: 18.18.0
    Yarn: 1.22.19
    npm: 9.4.2
    pnpm: 8.14.0
  npmPackages:
    @tresjs/cientos: 3.7.0 => 3.7.0 
    @tresjs/core: 3.7.0 => 3.7.0 
    vite: ^5.0.12 => 5.0.12

Used Package Manager

npm

Code of Conduct

[X] I agree to follow this project's Code of Conduct
[X] Read the Contributing Guidelines.
[X] Read the docs.
[X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
[X] The provided reproduction is a minimal reproducible example of the bug.

stackblitz[bot] commented 7 months ago

Start a new pull request in StackBlitz Codeflow.

vitejs-vite-eg7wqt (Open reproduction)

andretchen0 commented 7 months ago

@JaimeTorrealba , I can't get the StackBlitz to run. It's stalling here for me:

Any luck on your end?

JaimeTorrealba commented 7 months ago

Nop I can't...

I'll try tomorrow

Sea-DH1 commented 7 months ago

Is it a network problem? I tried it and it can be opened

andretchen0 commented 7 months ago

Is it a network problem? I tried it and it can be opened

The StackBlitz can be viewed now. Thanks. Unsure what the error was.

andretchen0 commented 7 months ago

Expected:

The camera should move when the mouse is click and dragged across the canvas.

Bug:

Nothing happens (on StackBlitz).

Further context

The code in the StackBlitz is taken from the docs example. Everything is working fine for me there.
The StackBlitz is using current releases of Cientos and Tres.
<OrbitControls /> works fine when imported and put in the place of <CameraControls ...>.
I cannot reproduce the bug when running the example code in a local playground.

Fwiw, here's another StackBlitz without style.css and assets, and with all Tres code in app.vue. The problem continues for me, but only on StackBlitz.

@Sea-DH1 : Can you reproduce the bug locally or anywhere else but StackBlitz? @JaimeTorrealba : Any ideas?

JaimeTorrealba commented 7 months ago

Yep, seems like something weird with StackBlitz.

In the playground and local works fine

https://play.tresjs.org/#eNqdVV1z2jgU/SsaZ3bysGCbkGR3vekOC/2Ydpo2U3ir+6DYN1iJLGkkQWAy/PdeSWDsNE1JwcOg+3F0dHTv9UM002D+VypeLiDKogtTaKYsMWAXinAq5q/yyJo8+i8XrFZSW/JAxtSwYlrRUt5fUtUj0y/vxhPJpZ4qWkCPfJIzKQBdiok52ZAbLWtybCsNcPxvC8dtPaFiSU0TNLJouzVJIXU3dkJr0HQihdWSPxHPQFhpXEouCimMJXNOXpGHXBBScKDaE8zI8dHfJ6/Hk7PjnvMYfwiTEasX4C2Uq4pm5IZyEwwhBA8zWyvIHp/dRciFVQu7FyB7LIgLsntFsq5A6N4g7YskSI9C48JCrTi1gCtCLlpCLfvXTJR4KXPuL4Xgx/uvQBsFhWVLCFqRTEnDLJMCo7/+0yPu+ZZHJNmlPdK0sTu4SzBVF6F/0iP4pA4i09LSnSPtkUtqq/jqffBuYXa88aTvQNZg9ZpkVM+Nyxn0yCA+65Fhm1Br65mUAkFBM8pJ4aTErO3VtY+Q7BKe544U3eM2K6ix/XCp3W3HcvUET0dy9/Mirqdv3fc3uKLGTuoflZyqCvRey4OZvB2P0+H4l0xeM+3KRwrKP7J5ZX9QEEmd+stnwoJA1xodg/ikK+p2l7BHKFo0XCStisalsWvu/la25tgA17Jch16tUXkmMpJiSxCiaFn6jgnLChyxjAzS9A9vuGelrZr1JhdH2FMB6BexhFzT4m6u5UKUfS9VRo7S1O2DMNiMnmDUi8IE6tdUxbdGCpyRHj7fOnA0ZmFDZ2uPL+fIo8paZbIkKUqB+SVwttSxAJsIVSft8NEwPo8HScmMTZwZo/PIj44OcJhzL8EOGQj/V5zu4bfm7i72HuidouIQ7k3s6DROG+I7Y1wzl9PGduP/EFwXN0LE8xT5/gmmbsuAb6mFgYP1bYWPBml8hog4PWEV1111t3FYwRrKFwCHhOegMbBfQs0OAN2FusOfxucJZ9dtSIeIpbnBmrQGX3E3bP6oIgtZK8ZBf1aua7uVSTmX9x+8rXnX+ZwKirsn7LdmFShfYbGAXqLc+6vEHgUb3G+mn2CF/xtnLcsF317OT5xfwEi+cBxD2Bh7EGm34jzb977BsP1n5s3KT5ztoTpELb6WvfXrbhw2tRYM37xwPt5fx+QZlfYnG8bDRvDNd5en/BE=

Sea-DH1 commented 7 months ago

@andretchen0 @JaimeTorrealba The code is copied from the document CameraControls, nothing has changed.

Sea-DH1 commented 7 months ago

@JaimeTorrealba I directly copied the code you linked above, but it’s still the same, the camera can’t rotate.

andretchen0 commented 7 months ago

@JaimeTorrealba I directly copied the code you linked above, but it’s still the same, the camera can’t rotate.

@Sea-DH1 , into a StackBlitz? Locally?

Sea-DH1 commented 7 months ago

@andretchen0 This link https://stackblitz.com/edit/vitejs-vite-28xfvq?file=src%2FApp.vue

Sea-DH1 commented 7 months ago

@JaimeTorrealba Hi, may I ask which version of cientos is used in your case? I copied my code and it ran normally.

JaimeTorrealba commented 7 months ago

@Sea-DH1 seems like with the cientos v3.8.0 works fine

Sea-DH1 commented 7 months ago

@JaimeTorrealba Wow, yes, I updated to version 3.8.0 and it works normally