Scene Time of FVS Custom Model Component

Application scenarios: If you have installed the FVS plugin, you can view this article to learn about functions related to FVS templates.

Note: Mobile devices are not supported.

Version

Application Scenarios

You can use the time system to quickly set desired lighting, sky and other effects. You can also present dynamic effects of scenes changing with time through JS interface.

Function Introduction

Set Scene > Environment > Scene time in the custom model component editing interface:

1. The default time is 14:00. You can change it by sliding or clicking the timeline, or directly edit it in the time display box. The input box only supports integers from 0 to 24.

2. The label in the top right corner of the scene time indicates the scene state is automatic and Sky Background, Environmental Light, and Light Source are the default settings corresponding to the scene time.

3. If any setting in Sky Background, Environmental Light, Light Source is modified after the scene time is determined, the scene state will become manual, and the top right corner will be changed as .

4. Under the manual scene state, if the scene time is modified again, the scene state will change to the corresponding automatic scene state of the time.

5. Under the automatic scene state, the animateSceneTime() interface is supported to achieve dynamic changes in scene time.

The example in this article demonstrates how you can trigger dynamic changes in the custom model component scene by clicking the title component.

Creating a Template

Click File > New FVS Report > Create Big Screen From Blank Area, set the template name to FVS Custom Model Scene Dynamic Change, and click Create Template.

As is shown below:

Setting up Custom Model Component

1. Adding Components and Creating Scenes

Add a custom model component to the page, click Edit Component to generate an empty scene. The scene state should be automatic. As is shown below:

2. Adding the Model

a. Click to download and decompress the warehouse model: Warehouse.zip

b. In the custom model component editing interface, click Model > Add Model > Upload New Model. After uploading the Warehouse model, you can select it and click Finish to add it to the scene. As is shown below:

c. Select Warehouse in the model list, adjust the scaling, position, and visual direction and so on. As is shown below:

d. After the setup, click Return to editor to go back to the canvas page.

Setting Click Event of the Title

1. Adding the Title Component

Click Text > Title, add it to the canvas, and set the title content to Click to trigger a scene state change. As is shown below:

2. Setting the JavaScript Click Event

Select the title component, click Interaction > Click > Add Click Event > JavaScript, set the event name and enter the JavaScript in the pop-up box:

Note: The corresponding numbers after from should be smaller than those after to, and they only support integers.

duchamp.getWidgetByName("Customize the model1_Page1").animateSceneTime({
     from: 14, //Start at the default 14:00
     to: 38, //Finish at 14:00 the next day
     duration: 3000 //The duration of the change is three seconds 
});         

As is shown below:

Previewing the Effect

Save the report, click Preview and the effect will be shown as follows:

To download the template, click: FVS Custom Model Scene Dynamic Change.fvs