search

meshcat-dev / meshcat

Remotely-controllable 3D viewer, built on top of three.js
MIT License
250 stars 44 forks source link

Bump three version #116

Closed joemasterjohn closed 1 year ago

joemasterjohn commented 2 years ago

RE: RobotLocomotion/drake#17149

Capsule geometry was added to THREE in mrdoob/three.js#23586 and release in r140. This PR bumps the THREE dependency to 0.140.

This change is Reviewable

rdeits commented 2 years ago

It looks like the gradient background is not working on this branch:

meshcat

Do you see the same thing locally?

joemasterjohn commented 2 years ago

Yes same thing on my end. It looks like they deprecated THREE.RGBFormat in favor of THREE.RGBAFormat. I made the necessary changes here in gradient_background().

meshcat_bg

The only other weirdness I saw was in test/meshfile_object_dae.html the cube was not loading. The error in the JS console pointed to mrdoob/three.js#12530 as a known issue.

jwnimmer-tri commented 2 years ago

I'll also note that three.js version r141 has been released in the meantime. Is it worth bumping this to match, to stay as up-to-date as possible?

rdeits commented 2 years ago

I'm open to trying r141, but I'm confused about why the DAE mesh is no longer working. That issue goes back to 2017, so it should have already been affecting our prior version of threejs.

rdeits commented 2 years ago

It also seems like that issue shouldn't be causing the object to fail to render entirely. The warning is, I think, expected given the particular .dae file, so it may be a red herring.

rdeits commented 2 years ago

I wonder if the issue is the wwobjloader2 module (which handles object loading) requires three v133. That appears to be resulting in three v133 and three v140 being installed, with some weird mixture of the two in actual use.

jwnimmer-tri commented 2 years ago

@joemasterjohn are you still working on debugging this, or would you like someone TRI more help take this over and work through all of the debugging?

BryonLewis commented 2 years ago

I am currently looking into this issue and attempting to resolve the problem with loading files.

BryonLewis commented 2 years ago

I'll do some further testing but it looks like the file loads properly it just isn't displaying. I haven't tracked down why but the result of some change is that the material for the 'dae' loader is set to opacity: 0, transparent: true when loaded.

This can be demonstrated to by hopefully just adding geometry.material.opacity = 1.0; right below this line: https://github.com/rdeits/meshcat/blob/master/src/index.js#L19

I'll continue with some further tests to ensure this was the only thing happening.

BryonLewis commented 1 year ago

Looking at it closer it seems as though the latest release is properly reading the Collada form in the meshfile_object_date.html. There is a section in there setting the transparency:

                        <transparent>
                            <color>1 1 1 1</color>
                        </transparent>
                        <transparency>
                            <float>0</float>
                        </transparency>

Before it wasn't setting the object to transparent. If you modify the <float>0</float> value to 0.5 or to 1 you can see the box now. If you remove both the <transparent> and <transparency> tags it will show the box as well.

Looking at the three.js source code in this section: https://github.com/mrdoob/three.js/blob/4afef617be65dcd67a67cfbf1bd5cb1864cef50b/examples/jsm/loaders/ColladaLoader.js#L1709-L1740 Handles the transparency loading of the Collada file. I believe that this PR is the cause of the change in behavior: https://github.com/mrdoob/three.js/pull/22679 It specifically updates so that having a transparency element will cause transparency to turn on and be set to 0.

jwnimmer-tri commented 1 year ago

Hi @rdeits, do have any suggestions on this PR?