Help Center/ DataArts Insight/ User Guide/ Creating a Large Screen/ Setting Global Parameters
Updated on 2025-02-25 GMT+08:00
View PDF
Share

Setting Global Parameters

Large Screen Editing Page

Figure 1 Large screen editing page
Table 1 Large screen areas

Area

Description

Toolbar

In the toolbar, you can align components to the left, center horizontally, align to the right, align to the top, center vertically, align to the bottom, bring to the front, or send to the back.

Page configuration area

Layers: Multiple layers are supported. You can configure layer groups, rotate layers, lock and hide layers, and more.

Components: Add a variety of components to your large screen, including rich text, media, interactive controls, and materials to meet diverse needs.

Data processing area

You can select datasets, add data, modify data formats, and process data.

Style configuration area

Area for configuring the styles of data reports and components.

Toolbar

  1. Undo: Click the undo button in the toolbar if you make a mistake in setting parameters.
  2. Redo: Click the redo button in the toolbar to restore the undo step if you make a mistake in undoing.
  3. Align Left: Align to the left margin based on the selected component or combination. If you select two or more components or combinations, the alignment rule is to align with the leftmost component or combination.
  4. Center Horizontally: Align to the center based on the middle position of the selected element.
  5. Align Right: Align to the right margin based on the selected component or combination. If you select two or more components or combinations, the alignment rule is to align with the rightmost component or combination.
  6. Align Top: Align to the top margin based on the selected component or combination. If you select two or more components or combinations, the alignment rule is to align with the topmost component or combination.
  7. Center Vertically: Align to the center based on the middle position of the selected element.
  8. Align Bottom: Align to the bottom margin based on the selected component or combination. If you select two or more components or combinations, the alignment rule is to align with the bottommost component or combination.
  9. Move Down: Move the component or combination down one layer.
  10. Move Up: Move the component or combination up one layer.
  11. Pin to Top: Bring the component to the front of the canvas.
  12. Pin to Bottom: Send the component to the back of the canvas.
  13. Zoom Canvas: Adjust the canvas zoom ratio, with a minimum value of 10% and a maximum value of 200%. You can adjust it through the scroll bar or drop-down box, and also support manually entering the zoom ratio. The shortcut key is Ctrl + mouse wheel.

Shortcut Keys

Table 2 Keyboard shortcut keys

Operation

win

Undo

Ctrl+Z

Redo

Ctrl+Y

Duplicate

Ctrl+D

Delete

Backspace

Multi-select

Ctrl + mouse click

Group

Ctrl+G

Ungroup

Shift+Ctrl+G

Pin to Top

Ctrl+Alt+]

Pin to Bottom

Ctrl+Alt+[

Move Up

Ctrl+]

Move Down

Ctrl+[

Lock/Unlock

Ctrl+l

Unhide/Hide

Ctrl+h

Move Component Left/Right/Up/Down

← → ↑ ↓

Preview

F9

Save

Ctrl+s

Zoom Canvas

Ctrl + mouse wheel

Pan Canvas Left/Right

Shift + mouse wheel

Pan Canvas Up/Down

Mouse wheel

Drag Canvas

Press and hold space bar and click mouse to drag

Setting Large Screen Parameters

Set the following large screen parameters:

  • Adjust the canvas zoom ratio, with a minimum value of 10% and a maximum value of 200%. You can adjust it through the scroll bar or drop-down box, and also support manually entering the zoom ratio. The shortcut key is Ctrl + mouse wheel.
    Figure 2 Adjusting the size of the large screen in the canvas area using the slider
    Figure 3 Adjusting the size of the large screen in the canvas area using the drop-down list
  • Toggle the grid on or off in the canvas.
    Figure 4 Toggling the grid on
    Figure 5 Toggling the grid off
  • Set the following large screen parameters:
    • There are four screen sizes to choose from: 1280×720px, 1920×1080px, 2560×1440px, and 3840×2160px. You can control them through a drop-down list or customize the height and width of the screen by inputting your own values.
      Figure 6 Controlling the screen size through a drop-down list
      Figure 7 Controlling the screen size by customizing the height and width
    • Adjust the background color of the canvas using the background color option.
      Figure 8 Background color
    • Background image of the screen. You can upload the background image as required.

      Use this feature with caution as it may result in the leakage of your background image data.

      Figure 9 Background image
    • There are four screen scaling modes to choose from: proportional scaling, proportional scaling to width, proportional scaling to height, and full-screen stretching.
      Figure 10 Zoom mode
Table 3 Large screen parameters

Parameter

Description

Default Value

Size of the large screen in the canvas area

Size of the large screen displayed on the canvas, in percentage. The minimum value is 10% and the maximum value is 200%.

100%

Grid

Toggle the grid on or off on the canvas.

Toggle it on

Screen size

There are four screen sizes to choose from: 1280×720px, 1920×1080px, 2560×1440px, and 3840×2160px.

1920×1080px

Background color

Adjust the background color of the canvas using the background color option.

Black

Background image

You can upload your own background images for the screen as per your requirements.

None

Zoom mode

There are four screen scaling modes to choose from: proportional scaling, proportional scaling to width, proportional scaling to height, and full-screen stretching.

Proportional scaling

Layer Group

Layer configuration can enhance the layout of the canvas, where each element in the canvas is considered a layer. This part explains how to configure layer groups. The following operations can be performed on layers:

  • Group: Select two or more components by holding down Ctrl and clicking, then right-click to group them. The shortcut key for grouping is Ctrl+Shift+G.
  • Move Down: Move the component down one layer in the layer list. The shortcut key is Ctrl+].
  • Move Up: Move the component up one layer in the layer list. The shortcut key is Ctrl+[.
  • Move to Front: Move the component to the front of the layer list. The shortcut key is Alt+Ctrl+].
  • Move to Back: Move the component to the back of the layer list. The shortcut key is Alt+Ctrl+[.
  • Duplicate: Quickly copy a component or group on the screen. The shortcut key is Ctrl+D.
  • Hide: Hide a component or group. The shortcut key is Ctrl+H.
  • Rename: Rename a component or group.
Figure 11 Layer configuration

Flexibly Adjusting the Canvas Layout

This section explains the layout options for large screens, which allow for flexible adjustments to enhance the display of components on the canvas.

Compared to dashboards, large screens offer more flexibility in adjusting the canvas. You can freely drag and drop components and move them pixel by pixel. The toolbar on the top left can also be used to align components or groups to the left, center, or right, as well as to align them to the top, middle, or bottom, or to bring them to the front or back.

Figure 12 Toolbar

Reference Lines

To improve the usability of the large screen editor, DataArts Insight allows you to pull out reference lines on the left and top of the canvas, which always remain on top of the layers. The main function of reference lines is shown in Alignment, Definition, and Positioning.

Figure 13 Alignment
Figure 14 Definition
Figure 15 Positioning
Parent topic: Creating a Large Screen