Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

3DM geometry appears black in large/certain files after upgrading to latest version #27752

Closed
tb-viktor opened this issue Feb 15, 2024 · 6 comments

Comments

@tb-viktor
Copy link

tb-viktor commented Feb 15, 2024

Description

Hello,

We've encountered a regression with the Rhino3dmLoader after upgrading to the latest version of three. We've upgraded from version 0.156.1 to 0.161.0 and with that loaded rhino3dm@8.0.1 which is required by the loader. After doing so, certain geometries seem to break the loader and result in the loaded geometry appearing black. After loading the file that causes this, the following files that are loaded also appear black for that loader instance.

I've put together a quick codesandbox with the file in question, I am not sure whether it is the file size (around 50 MB) or something in the file that causes this: https://codesandbox.io/p/sandbox/three-rhino-latest-sxz2fy

I've uploaded the file separately here: https://filebin.net/a258vmwnae1nj10a - it has an expiration, so in case the link goes dead I will reupload.

Any ideas what is causing this?

Reproduction steps

  1. Load the provided file using Rhino3dmLoader in the latest three version, with rhino3dm@8.0.1.
  2. The geometry will appear black.
  3. Using the same loader instance load another file, this file (that might have been rendering fine previously) will also appear black).

Code

Quick React example:

import { useEffect, useRef } from "react";
import * as THREE from "three";

import { OrbitControls } from "three/examples/jsm/controls/OrbitControls.js";
import { Rhino3dmLoader } from "three/examples/jsm/loaders/3DMLoader";

const width = 640;
const height = 480;

export default function App() {
  const containerRef = useRef(null);
  const statusRef = useRef(null);

  useEffect(() => {
    if (containerRef.current && statusRef.current) {
      let camera, scene, renderer;
      let controls;

      init();
      animate();

      function init() {
        THREE.Object3D.DEFAULT_UP.set(0, 0, 1);

        renderer = new THREE.WebGLRenderer({ antialias: true });
        renderer.setPixelRatio(window.devicePixelRatio);
        renderer.setSize(width, height);
        statusRef.current.innerHTML = "Loading...";
        containerRef.current.innerHTML = "";
        containerRef.current.appendChild(renderer.domElement);

        camera = new THREE.PerspectiveCamera(60, width / height, 1, 1000);
        camera.position.set(26, -40, 5);

        scene = new THREE.Scene();
        scene.background = new THREE.Color(0xedf1ff);

        const directionalLight = new THREE.DirectionalLight(0xffffff, 3);
        directionalLight.position.set(0, 0, 2);
        scene.add(directionalLight);

        const ambientLight = new THREE.AmbientLight(0xffffff, 0.8);
        scene.add(ambientLight);

        const loader = new Rhino3dmLoader();
        loader.setLibraryPath("https://cdn.jsdelivr.net/npm/rhino3dm@8.0.1/");
        loader.load(
          "https://filebin.net/02okngzrvnv6pis8/circular_open.3dm",
          function (object) {
            statusRef.current.innerHTML = "Loaded";
            scene.add(object);
          }
        );

        controls = new OrbitControls(camera, renderer.domElement);
      }

      function animate() {
        controls.update();
        renderer.render(scene, camera);

        requestAnimationFrame(animate);
      }
    }
  }, []);

  return (
    <>
      <div ref={containerRef} />
      <div ref={statusRef} />
    </>
  );
}

Live example

Screenshots

image

Version

r161

Device

Desktop

Browser

Chrome

OS

Windows

@tb-viktor
Copy link
Author

For comparison this is how it renders in 0.156.1 and rhino3dm@7.15.0:

image

Codesandbox: https://codesandbox.io/p/sandbox/three-rhino-v7-v99r8c

@Mugen87
Copy link
Collaborator

Mugen87 commented Feb 15, 2024

There were only a two changes to the loader since r156: #26745 and #27631

Do you mind pinpoint which one breaks your assets? You can easily do this by just upgrade to r157 first. If you encounter issues, #26745 is the root cause.

@tb-viktor
Copy link
Author

There were only a two changes to the loader since r156: #26745 and #27631

Do you mind pinpoint which one breaks your assets? You can easily do this by just upgrade to r157 first. If you encounter issues, #26745 is the root cause.

Yes, 0.157.0 already produces the black geometry since it's needed to load rhino3dm@8.0.1 for it.

@Mugen87
Copy link
Collaborator

Mugen87 commented Feb 15, 2024

/ping @fraguada

@fraguada
Copy link
Contributor

Thanks @tb-viktor, I had missed the notification here. Will update the issue once I understand what's going on.

@fraguada
Copy link
Contributor

I've pushed a fix that fixes the logic of creating materials and comparing them. What was happening is that objects with no material assignments get assigned a default material. In this case, there were objects with and without vertex colors, and at some point, the default material would get the vertex color flag set to true, meaning meshes without vertex colors would be rendered black.

@Mugen87 Mugen87 closed this as completed Feb 27, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants