Toolbar and light configuration

Help
1

Hi again :smiley:

I’m still working on a project that uses the viewer found here: https://www.npmjs.com/package/@speckle/viewer
I need a toolbar that is quiet similar to the the one of the embedded viewer. So far I have just created a custom toolbar, which is fine.
However, I’m having some small troubles with the light configuration.
My model doesn’t look as good, as it does in the embedded viewer and I have tried to play around with the light configurations where a few questions came up.

  1. this.viewer.setLightConfiguration({ indirectLightIntensity: value }) doesn’t seem to do anything for me. value is a number between 0 and 2.5 going in steps of 0.1
  2. Do you guys have any tips on good min- and max-values +steps for the light configuration? currently I tried to copy the ones that I have found while inspecting the toolbar of the embedded viewer.
  3. Are there any plans to add a similar toolbar to this viewer?

Cheers :smiley:

1 Like
2

hi @mgerhardt! I think it’s all about “eyeballing” it - we don’t have any tips here :sweat_smile:

  1. you might need to provide the full light configuration object itself to make things work as expected. i didn’t dig into this though!

  2. The min max we use are 0 to 5 for the indirect light slider we have in our frontend. The effect depends a lot if you also play around with the sun intensity. I’ll copy paste the exact values we have in the frontend for all the parameters there:

<v-slider
        v-model="config.intensity"
        step="0"
        max="10"
        min="1"
        :thumb-size="24"
        label="Sun intensity"
        :disabled="!config.enabled"
      />
      <v-slider
        v-model="config.elevation"
        step="0"
        :min="0"
        :max="Math.PI"
        :thumb-size="24"
        label="Sun elevation"
        :disabled="!config.enabled"
      />
      <v-slider
        v-model="config.azimuth"
        step="0"
        :min="-Math.PI * 0.5"
        :max="Math.PI * 0.5"
        :thumb-size="24"
        label="Sun azimuth"
        :disabled="!config.enabled"
      />
      <v-slider
        v-model="config.indirectLightIntensity"
        step="0"
        min="0.0"
        max="5.0"
        :thumb-size="24"
        label="Indirect light"
      />

(sorry for the lazy paste!)

  1. Most likely not any time soon as it’s a complicated problem, as whatever viewer buttons/controls we add in the viewer library itself (or next to it) would be framework specific, and it’s a bit of a pain to abstract away. We discussed internally at some point, and we didn’t find a straightforward solution.

We do want to productify our viewer for developers soon (better docs, examples, etc.) but it’s not yet prioritised or in the backlog.

3 Likes