You can add one or more scatter plots to a project to display the series in different time periods.

Style

  • Global Settings
    • Font Family: To set the font of the displayed text, click the drop-down arrow and select the target font. The default font is Microsoft YaHei.
    • Margin
      • Top: To adjust the spacing between the scatter plot and the top border, enter a value, or click + or –.
      • Bottom: To adjust the spacing between the scatter plot and the bottom border, enter a value, or click + or –.
      • Left: To adjust the spacing between the scatter plot and the left border, enter a value, or click + or –.
      • Right: To adjust the spacing between the scatter plot and the right border, enter a value, or click + or –.
  • X Axis
    • Text Style
      • Font Size: To change the font size of the text along the x-axis, enter a value, or click + or –.
      • Font Color: To change the font color of the text along the x-axis, see Color picker.
      • Font Weight: To set the font weight of the text along the x-axis, click the drop-down arrow and select the target font weight.
    • Axis Label: To display the axis labels, click the Eye icon.
      • Data Type: To set the data type of the axis labels, click the drop-down arrow and select the target type.
        Note The data type corresponds to the value of the x field in the data pane. If the value is a date, set the data type to time. If the value is a category, set the data type to category. If the value is a number, set the data type to numeric.
        • Numeric
        • Category
        • Time
      • Data Format: To set the data format, click the drop-down arrow and select the target format.
        Note This option is displayed only when Data Type is set to Time. The data format must match the time format.
      • Display Format: To set the display format of the data along the x-axis, click the drop-down arrow and select the target format. The data can be displayed in time or numeric format. If you select the time format, keep the decimal digits as needed. If you select the numeric format, set the year, month, day, hour, and second as needed.
      • Max: You can customize the maximum time or number value to be displayed. The maximum value can be displayed in time or numeric format.
      • Min: You can customize the minimum time or number value to be displayed. The minimum value can be displayed in time or numeric format.
        Note The default minimum and maximum values of the axis labels indicate a time range. The values in the time range correspond to the x field in the data pane. If the data in the data pane is inconsistent with a value in the time range, the value in the time range takes priority.
      • Unit: You can customize the unit of data along the x-axis as needed. If the spacing between the scatter plot and the right border is too small, the unit will not be displayed. The unit can be in time or numeric format.
      • Quantity: To change the number of x-axis labels, enter a value, or click + or –.
      • Angle: To set the angle of the x-axis labels, click the drop-down arrow and select the target angle.
        • Horizontal
        • Slant
        • Vertical
    • Axis Line: To display the axis line, click the Eye icon.
      • Color: To change the color of the x-axis line, see Color picker.
    • Grid Lines: To display the grid lines, click the Eye icon.
      • Color: To change the color of the grid lines, see Color picker.
  • Y Axis
    • Text Style
      • Font Size: To change the font size of the text along the y-axis, enter a value, or click + or –.
      • Font Color: To change the font color of the text along the y-axis, see Color picker.
      • Font Weight: To set the font weight of the text along the y-axis, click the drop-down arrow and select the target font weight.
    • Axis Label: To display the axis labels, click the Eye icon.
      • Min: To set the format of the minimum value along the y-axis, click the drop-down arrow and select the target format.
        • Minimum data value
        • Automatic rounding
      • Max: To set the format of the maximum value along the y-axis, click the drop-down arrow and select the target format.
        • Maximum data value
        • Automatic rounding
      • Quantity: To change the number of y-axis labels, enter a value, or click + or –.
      • Display Format: To set the display format of the axis labels, click the drop-down arrow and select the target format.
      • Angle: To set the angle of the y-axis labels, click the drop-down arrow and select the target angle.
        • Horizontal
        • Slant
        • Vertical
    • Axis Unit: To display the axis unit, click the Eye icon.
      • Unit: You can customize the unit of data along the y-axis as needed.
    • Axis Line: To display the axis line, click the Eye icon.
      • Color: To change the color of the y-axis line, see Color picker.
    • Grid Lines: To display the grid lines, click the Eye icon.
      • Color: To change the color of the grid lines, see Color picker.
  • Legend
    • Text Style
      • Font Size: To change the font size of the legend items, enter a value, or click + or –.
      • Font Color: To change the font color of the legend text, see Color picker.
      • Font Weight: To set the font weight of the legend text, click the drop-down arrow and select the target font weight.
    • Layout
      • Margin
        • Horizontal Interval: To adjust spacing 1 (spacing between the legend items and the right border of the scatter plot) and spacing 2 (spacing between the legend items and the left border of the scatter plot), enter a value, or click + or –.
        • Vertical Interval: To adjust spacing 1 (spacing between the legend items and the top border of the scatter plot) and spacing 2 (spacing between the legend items and the bottom border of the scatter plot), enter a value, or click + or –.
      • Position: To set the position of the legend items, click the drop-down arrow and select the target position.
        • Top center
        • Top left
        • Top right
        • Bottom center
        • Bottom left
        • Bottom right
  • Series: To add or delete a series, click + or click the Trash icon. The series value corresponds to the value of the s field in the data pane.
    • Series: You can set a name for the series as needed.
    • Color: To set the fill color type, click the drop-down arrow and select the target type. To change the fill color, see Color picker.
      • Solid fill
      • Gradient fill: You can select two colors as the gradient colors.
      • To change the gradient angle, enter a value or drag the slider. The value range is from 0 to 360.
    • Outline Color: To change the outline color of the plots, see Color picker.
  • Animation: To display the animation option, click the Eye icon.
    • Original Duration: To change the duration to which the widget renders the animation for the first time, enter a value, or click + or –. The unit is milliseconds.
    • Easing: To set animation easing, click the drop-down arrow and select the target effect.
    • Duration for Data Update: To change the animation duration when data changes, enter a value, or click + or –. The unit is milliseconds.

Data

  • x: category data along the x-axis
  • y: data along the y-axis
  • s: (optional) series, which indicates the data category

Interaction

This widget is not connected to any events yet.