Search code examples
javascriptthree.js3dthreebox

Threebox CastShadow on 3D Model

Im doing a project using threebox js and trying to get the shadow of 3D models imported. Following the documentation https://github.com/jscastro76/threebox/blob/master/docs/Threebox.md#threebox-methods When i create a object i change the property to TRUE (code below).

window.tb.loadObj(proptions, function (model) {
    model.setCoords(place);
    model.addTooltip("A radar in the middle of nowhere", true);
    model.setRotation({ x: 0, y: 0, z: Math.floor(Math.random() * 100) })
    model.castShadow = true;
    window.tb.add(model);

});

This is what i get when doing so: What i get doing castShadow

Resolved

As @jscastro responded i was using a 3d Model that had a light. That light was messing with my scene lights. Check @jscastro response for more detail.

Solution

  • The issue you are facing with the bus stop model from sketchfab is that it has embedded its own lighting below the ground level that is breaking the shadows from the scene in threebox. enter image description here

    That's what produces an issue with the shadow when the model is loaded in threebox. I have loaded all your models in threebox with no issues and showing a tooltip, including the bus stop. enter image description here

    If you definitely want to use that bus stop model, you will need to modify it with Threejs editor and remove the light point and then export it again.