Apply shader to model-viewer using vue.js

Question

I'm using Google's ModelViewer for a WebAR project.

I have a vue.js project and I have a component that is loading the model with the attribute. I have also installed vue-gl with npm just in case it's needed.

I'd like to know if I can (and what do I need to) apply custom shaders on the 3D model of the ModelViewer.

Any help will be very appreciated.

user_15794100 · Answer

To adjust the shading you must add lighting to the scene

Like This:

https://modelviewer.dev/examples/lighthouse.html

or this:

https://modelviewer.dev/examples/tester.html

you can use Model Viewer Editor: https://modelviewer.dev/editor/

This document will help you:

https://modelviewer.dev/docs/index.html#entrydocs-lightingandenv-attributes-shadowIntensity

Apply shader to model-viewer using vue.js

1 Answers