Black boxes appearing with models

[JennyTanlol]

One of the models I came across from love nikki cannot load properly , although the animation behind the black box seems to be working fine the body hitbox is non-transparent but removing hitbox in model3.json does not work This is the file: https://www.dropbox.com/sh/w5j6046pynje8js/AADfJbylf2qFUXLHQyE713x-a?dl=0 How it looks like loaded:

[guansss]

This seems to be a problem of the model itself, as I got the same effect when testing it on Live2D's official web demo (https://github.com/Live2D/CubismWebSamples). Have you been able to load this model successfully on another platform?

[JennyTanlol]

Thanks for replying! I managed to have it loaded in unity's SDK, and the file and motion both work fine after deleting the 'hitbox' artmesh. The image first loaded (without deleting the mesh) looks identical to what was on the web version, motion and mesh are fine but with a box covering it. But it is not very convenient and alpha motions are weird Is it possible to implement 'delete or hide art mesh' function on the web version? Thanks in advance

[guansss]

Alright, according to the information, I've got it to work by adding the following code:

model.internalModel.coreModel.getDrawableOpacity = function (i) {
    // make the HitArea transparent
    if (this._model.drawables.ids[i] === 'HitArea') {
        return 0;
    }

    return this._model.drawables.opacities[i];
};

It's quite ugly but I couldn't find a better solution.

And unfortunately the web viewer does not support scripting, so you'll probably need to fork this repo and make your own changes.

[JennyTanlol]

Got it, thanks again!

[JennyTanlol]

Sorry but one last question, I forgot to ask since I know close to nothing for coding, where do I add that script on? sorry again for the bother ;;

[guansss]

No problem.

Actually I just realized that you can run a patch script on the fly, without having to look into the source code.

First load your model in the web viewer, then press F12, paste the following code into console, and hit enter to run.

App.models.forEach((model) => {
  model.pixiModel.internalModel.coreModel.getDrawableOpacity = function (i) {
    if (this._model.drawables.ids[i] === "HitArea") {
      return 0;
    }

    return this._model.drawables.opacities[i];
  };
});

However you have to do this every time you enter the page, let me know if that doesn't fit your need.

[JennyTanlol]

Thanks a lot, it worked perfectly! No more problems, thank you again for your patience!