The blueprint editor in a 3D City Builder project lets you edit the control logic for the project's black box products. This topic describes how to use the blueprint editor in a 3D City Builder project.
From the scenario editor in your 3D City Builder project, you can export layers, keyframes, and scenarios to the blueprint editor. In the blueprint editor, you can then orchestrate their logical interactions.
Configure interactions in the 3D City Builder blueprint editor
- In the project scenario editor, click the
icon in the upper-left corner. - On the blueprint editor configuration page, click the 3D City Builder node in the Import Node section. The configuration parameters for the 3D City Builder widget appear on the canvas, as shown in the following figure.
- Events
Event Description Scenario loaded The scenario is loaded. No data is returned. Screen position of anchor point changed The screen position of an anchor point changed. Returns an array of screen coordinates for the anchor points in the current view. Note A screen anchor point is a target location in a 3D scenario. It is defined by longitude, latitude, elevation, and an optional ID. 2D charts are attached to the specified anchor point locations. - Actions
Parameter Description Play current scenario animation Plays the current scenario animation. No parameters are required. Pause current scenario animation Pauses the current scenario animation. No parameters are required. Stop current scenario animation Stops the current scenario animation. No parameters are required. Change camera position and rotation Smoothly moves the camera's position and rotation angle. The dynamically passed data is an object. The following code provides an example of the parameters. { "position": {},// New camera position "rotation": {},// New rotation angle "duration": 1, // Camera smoothing transition time in ms "easeType": "" // Easing function type }Enable or disable screen anchor points Specifies whether to use screen anchor points. The data passed to the action is an object. The following code provides an example of the parameters. { "flag": true // Specifies whether to use screen anchor points }Add screen anchor points Adds screen anchor points in the 3D space. The data passed to the action is an object. The following code provides an example of the parameters. { "anchors": [], // Anchor points "needClear": true // Specifies whether to purge existing anchor points. Default value: true }Note A screen anchor point is a target location in a 3D scenario. It is defined by longitude, latitude, elevation, and an optional ID. 2D charts are attached to the specified anchor point locations.Update widget configuration Updates the widget configuration. No parameters are required. Show Shows the widget. The following code provides an example of the parameters. { "animation": { // Animation method. Set to fade. If left empty, no animation is used. "animationType": "", // Display delay in ms. "animationDuration": 1000, // Display animation function. Valid values: linear, easeInOutQuad, and easeInOutExpo. "animationEasing": "linear" } }Hide Hides the widget. The following code provides an example of the parameters. { "animation": { // The animation type. A valid value is fade. If you leave this parameter empty, no animation is used. "animationType": "", // The animation duration in milliseconds (ms). "animationDuration": 1000, // The animation easing function. Optional values: linear, easeInOutQuad, or easeInOutExpo. "animationEasing": "linear" } }Toggle visibility Toggles the visibility of the widget. The following code provides an example of the parameters. { // true: show, false: hide. "status": true, // Show animation. "animationIn": { // Animation method. Set to fade. If left empty, no animation is used. "animationType": "fade", // Display delay in ms. "animationDuration": 1000, // Display animation function. Valid values: linear, easeInOutQuad, and easeInOutExpo. "animationEasing": "linear" }, // Hide animation. "animationOut": { // Animation method. Set to fade. If left empty, no animation is used. "animationType": "fade", // Hide delay in ms. "animationDuration": 1000, // Hide animation function. Valid values: linear, easeInOutQuad, and easeInOutExpo. "animationEasing": "linear" } }Move Moves the widget to a specified position. The following code provides an example of the parameters. { // Movement method. Absolute positioning: to. Relative positioning: by. Default value: to. "positionType": "to", // Specified position. x-coordinate, y-coordinate. "attr": { "x": 0, "y": 0 }, // Animation method. "animation": { "enable": false, // Animation delay. "animationDuration": 1000, // Animation curve. Valid values: linear, easeInOutQuad, and easeInOutExpo. "animationEasing": "linear" } }
- Events
该文章对您有帮助吗?