Quick styling toolbar
Styling your chart easily and quickly with quick styling toolbar
Last updated
Styling your chart easily and quickly with quick styling toolbar
Last updated
When you style a box, it means that you style all components in your chart
Elements in Box include:
Text color
Background color
Boder (Weight, Radius, Border line, Border color)
Shadow
Style elements for Title
Font text
Font size
Text format (Bold, Italic)
Title color
Apply for table chart
You can click the header section or click “Header” in the toolbar
Below are some options you can see to style the header (name of column) in the table From the left to the right, let’s discover
Font family: Change the font of your header
Fontsize: Change the size of your header
Bold: Bold your header
Italic: Format your header with italic side
Text Color: Color your header
Fill color: Fill color to your header area
Text Alignment: Align your header to the left, central, right
A legend is an explanation of characters, symbols in chart. Like style title, there are some options you can do to style legend
Font text for legend
Font size
Legend text format (Bold, Italic)
Legend color
You can enable
Bar stacking
Set stacking percentage
Unit type: choose unit type for your label
Digital storage: B, KB, MB, GB, TB. For example: 1MB = 1024B
Digital storage 10 base: B, KB, MB, GB, TB. For example: 1MB = 1000B
Metric length: Mm, cm, dm, m, dam, hm, km
Percentage: %
Time: Microseconds, milliseconds, seconds, minutes, hours
Other
For data label, there are many choices you should style:
Enable data labels: labels will show on bar graph
Label position: Above, Center, Below
Label orientation: Vertical, Horizontal
Font family: Choose font family for the label
Font size: Choose font size for the label
Font format : Bold, Italic
Color: Color your label
Chart type: Pie chart and donut-pie chart
Donut style: Choose inner radius to select the thick of donut chart
Slice label: Allow to choose percentage or label
Unit:
Digital storage: B, KB, MB, GB, TB. For example: 1MB = 1024B
Digital storage 10 base: B, KB, MB, GB, TB. For example: 1MB = 1000B
Metric length: Mm, cm, dm, m, dam, hm, km
Percentage: %
Time: Microseconds, milliseconds, seconds, minutes, hours
Other
For data label, there are many choices you should style:
Enable data labels: labels will show on bar graph
Label position: Above, Center, Below
Label orientation: Vertical, Horizontal
Font family: Choose font family for the label
Font size: Choose font size for the label
Font format : Bold, Italic
Color: Color your label
Line style: Enable stacking line or/ and 100% stacking
For data label, there are many choices you should style:
Enable data labels: labels will show on bar graph
Label position: Above, Center, Below
Label orientation: Vertical, Horizontal
Font family: Choose font family for the label
Font size: Choose font size for the label
Font format : Bold, Italic
Color: Color your label
Horizontal bar chart is like bar chart, but it rotates to the horizontal style. You can style horizontal like style bar chart.
Note
Bottom axis of horizontal bar chart is the left axis of bar chart
Left axis of horizontal bar chart is the bottom axis of bar chart
Line style
Line weight: the visual lightness, darkness, or heaviness of a line within a drawing from 0 to 14
Curve: Smooth, Straight, Stepline
Area: toggle to enable
Bar style
Column width: Extremely narrow, narrow, Default, Wide
Data label: See style a bar chart
Y axis
Reverse: reverse y axis to the opposite
Show value: Show or hide y axis value
Mostly card chart are text and number, so, there are box and title options we can style
Click the header section or Click “Data” in the toolbar Below are some options you can see to style your Data
From the left to the right, let’s discover
Select Column: Choose column to style. You can choose all columns
Font: Change the font of your data
Fontsize: Change the size of your data
Bold: Bold your data
Italic: Format your data with italic side
Text Color: Color your data
Fill color: Fill color to your data area
Text alignment: Align your data to the left, central, right
Size: pull to choose the size of node
For data label, there are many choices you should style:
Enable data labels: labels will show on bar graph
Label position: Above, Center, Below
Label orientation: Vertical, Horizontal
Font family: Choose font family for the label
Font size: Choose font size for the label
Font format : Bold, Italic
Color: Color your label
Size: pull to choose the size of node
For data label, there are many choices you should style:
Enable data labels: labels will show on bar graph
Label position: Above, Center, Below
Label orientation: Vertical, Horizontal
Font family: Choose font family for the label
Font size: Choose font size for the label
Font format : Bold, Italic
Color: Color your label
Nodes
Aligment: Align nodes to the left, center, right or justify
Sort: Auto, Acsending, Descending, Input
Thickness: Adjust the thickness for nodes
Spacing: Identify the space beetween the source and the target
Border radius: Set for the nodes
Links
Enable gradient: enable to show gradient, unenable to unshow
Link contract: Adjust the size of link contract
Format
Unit: choose the unit for the value:
Digital storage: B, KB, MB, GB, TB. For example: 1MB = 1024B
Digital storage 10 base: B, KB, MB, GB, TB. For example: 1MB = 1000B
Metric length: Mm, cm, dm, m, dam, hm, km
Percentage: %
Time: Microseconds, milliseconds, seconds, minutes, hours
Other
For data label, there are many choices you should style:
Enable data labels: labels will show on bar graph
Label position: Above, Center, Below
Label orientation: Vertical, Horizontal
Font family: Choose font family for the label
Font size: Choose font size for the label
Font format : Bold, Italic
Color: Color your label
Color: Choose the range of color topresent in the map
Border: Choose to set the border weight for area border
Unit type:
Digital storage: B, KB, MB, GB, TB. For example: 1MB = 1024B
Digital storage 10 base: B, KB, MB, GB, TB. For example: 1MB = 1000B
Metric length: Mm, cm, dm, m, dam, hm, km
Percentage: %
Time: Microseconds, milliseconds, seconds, minutes, hours
Other: Choose the unit for the value
X axis is applicable for bar chart, horizontal bar chart, line chart, mixed chart, bubble chart, scatter chart
Show value: Click to show x axis, Hide to disappear x axis
X scale: scale the x axis
Datetime: show time series in x axis. You can custom the date time format in “x tooltip format” field
Category: show a dimension in x axis
Numeric: order by number
Reverse: change the data’s x axis to the opposite
Dimension position: Horizontal, Incline, Vertical
Y axis is applicable for bar chart, horizontal bar chart, line chart, mixed chart, bubble chart, scatter chart
Show value: Click to show left axis, Hide to disappear left axis
Min/max value: Min y axis value & Max y axis value Min & max value can be a number or math which is used to set max or min value for y axis
max(a, b, c,...): to get max value
min(a, b, c,...): to get min value
Reverse: change the data’s y axis to the opposite
Show toolbar: You can see the toolbar shown on the right, click to download chart as file svg, png, csv
Hide toolbar: Toolbar will disappear in your chart
Toolbar Position: Position the toolbar within a chart
