Model-viewer: Zoom after page Scrolling and change default light

Created on 10 Jun 2020  路  6Comments  路  Source: google/model-viewer

Hi, i have 2 problem.
1 ) My model camera changes with this code after scroll:
camera-orbit="calc(-300rad + env(window-scroll-y) * -6rad) calc(80deg + env(window-scroll-y) * 0deg) calc(3m - env(window-scroll-y) * 1.5m)"
Now I want to zoom to the model with page scrolling and also change the camera view.

2 ) how can i change the models light?

thanks

question

All 6 comments

@mesmaili151
1) If I understand you correctly, your code is already working for scroll-based radius change and now you also want scroll-based field-of-view change? Try doing the same style of calc() on the field-of-view attribute. If that doesn't work, we can turn this into a bug.

2) To change lighting you need to specify a new equirectangular environment-image attribute, as demonstrated in our lighting example.

@elalish
yes, thanks, but can you send me one example of field of view?

  1. so have i to use another image for light?

@mesmaili151 You could try field-of-view="calc(45deg - env(window-scroll-y) * 20deg)". And yes, lighting in model-viewer is specified by an image (preferably HDR), except the default light which is generated at runtime.

@elalish thanks, its worked

@mesmaili151 Can you post a Glitch of what you've tried and what about it doesn't work? That'll give me a much better chance of helping.

@elalish thanks, I told its worked for me.

Was this page helpful?
0 / 5 - 0 ratings