Visualization Content

Visualization content is the ultimate form of data analysis presentation, serving as the final display of data analysis.

In HENGSHI SENSE, different application types offer various methods for creating visualizations. For analysis applications, users can create Dashboards to produce visualization content. Dashboards provide a wide range of control types and complex layout management to meet sophisticated visualization needs. For query applications, complex layouts are not necessary. We provide Pages that allow users to configure them conveniently. For report applications, the process is even more simplified; users only need to configure the report and query condition controllers to complete the setup.

Regardless of the type of application, HENGSHI SENSE abstracts certain concepts within visualizations. They are all composed of a Canvas and various types of Controls, with controls serving as the basic unit.

Canvas

The primary function of the canvas is to layout the controls, set the canvas style, and better present the visualized content.

In the canvas, you can adjust the arrangement of controls through layer ordering.

Canvas style is equivalent to dashboard style. Users can set different themes to display the dashboard in various styles.

The canvas supports two types of page layouts: adaptive and fixed size, catering to different display needs.

Controls

There are many types of controls, including chart-type controls for displaying analytical data, display-type controls for showing images and text, as well as functional controls for exporting data, refreshing data, and filtering data. A complete dashboard is composed of various controls with different functionalities. All controls adhere to the Control Settings.

Control Types

Based on whether the control displays analytical data, controls can be categorized into Chart Controls, Display Controls, and Functional Controls.

Chart Controls

Refers to various chart controls used to display analytical data, such as Bar Chart, Donut Chart, Pie Chart, Table, Map, and Custom Charts, with nearly 50 types of charts in total.

Display Controls

Generally, these do not include analytical data and are mainly used to display images, text, and other content to enhance the presentation of the dashboard. Examples include Container, Image, Rich Text, Shape Control, Web Control, Button, etc.

Functional Controls

Complete certain functions in the dashboard to assist users in obtaining analytical data, such as filtering data, exporting data, refreshing, and other functionalities, such as Filters, Parameter Controls.

Control Example

The following example demonstrates the process of creating a chart control using a line chart. The process for creating other controls is similar.

1. Select the chart control from the menu bar (in this case, a line chart).
   

2. Configure the control content, including settings for configuration, style, and interaction.

   • Configuration: Drag dimensions and measures into the configuration to generate aggregated chart data, displaying business information. In the example, the "Date" field (calculated by month, displayed in year/month format) is dragged into the dimensions, while "User Name," "Actual Order Delivery Days," and "Inventory Cycle Days" are dragged into the measures to generate the chart.
     
   • Style: Set the display style of the control. In the example, a custom title is set, along with chart content color, size, x-axis, y-axis, legend, and other styles. The modified chart is shown below.
     
   • Interaction: Configure the interactions within the chart control. In the example, the row limit is set to 1000, and the click interaction behavior in the chart is set to display a pop-up menu.
     

3. Configure the control's appearance and interactions. In the example, the control's corner radius is adjusted, and the interaction with other controls is set to linked filtering of related charts.
   

4. Complete the control creation and adjust its layout on the canvas.
   

From the example, it can be seen that creating a control involves configuring the control content and setting up the control's appearance and interactions. The following sections introduce these two aspects in detail.

Control Content

Control content includes control display content (analytical data, text content), control display style, and internal control interaction. These three parts are completed in Control Configuration, Style, and Interaction respectively.

• Configuration

  In Configuration, you set up analytical data, including configuring and processing data.

  Configuring Data: This refers to dragging Dataset Fields, Parameters, Metrics, and user attributes into the configuration area to generate charts.

  See Fields and Metrics for details.

  Processing Data: Once data is dragged into the chart, it needs to be processed. For example, performing calculations such as sum, average, deduplication, percentage, year-over-year and month-over-month comparisons; setting decimal places, calculation units, and display formats; setting sorting styles; and applying data filters.

  See Dimension Calculation, Measure Calculation, Sorting, and Filters for details.

• Style

  In Style, you adjust the display style of the control. On one hand, this makes the control more visually appealing and aligns it with the overall dashboard display style, such as configuring colors, font settings, and legend display. On the other hand, it highlights key content in the control, such as axis settings, reference line settings, and conditional formatting.

  See Chart Style for details.

• Interaction

  This mainly refers to the control's own interactive behaviors, such as the number of data rows displayed by the control, automatic refresh, range roaming, time roaming, and click interaction behavior after opening the chart.

  See Chart Interaction for details.

Tip

The options in Configuration, Style, and Interaction may vary for different controls. Not all controls include Configuration, Style, and Interaction. Chart-type controls generally include all three, while display-type controls typically do not involve analytical data and lack configuration options. Functional controls generally do not involve interaction and lack interaction options.

Control Layout

When using multiple controls, you can arrange them through layer ordering, adjusting the control hierarchy, alignment, distribution, etc.