We found 7 matches for: UI: Charts

An overview of all UI: Charts blocks currently available, updated daily!

apexcharts: range chart

Basic range chart

In-pins

series
options

Out-pins

uicomponent
apexcharts: combo chart

Combination line and bar chart

In-pins

Name
Data
X Axis
Y Axis line
Y Axis bar
Row Colors


Default:
#fff
Height
Data colors
Theme
Color palette
Sets the color palette for the columns

Default:
palette1
Bar Width
Width of the bars

Default:
50
Curve
Marker size
Show data labels
Label Position
Position of the Data Label, options: Top, Center, Bottom

Default:
center
Label fontsize


Default:
12px
Label Color


Default:
#fff

Out-pins

uicomponent
apexcharts: bar chart

Basic bar chart

In-pins

Name
Data
X Axis
Y Axis
Row Colors
Sets the colors of the background rows

Default:
#fff
Data colors
Sets the colors of the lines
Title align
Align the title, options: Left, Center, Right

Default:
left
Theme
Color palette
Changes the colors of the lines to presets made by Apexcharts

Default:
palette1
Height
Horizontal
Rotates the chart 90 degress and shows the data horizontal

Default:
false
Stacked
Stacks the data on top of each other instead of next to each other

Default:
false
Bar Width
Sets the width of the bars, use px or % to determine the width

Default:
50px
Spacing
Spacing between bars

Default:
0
Show data labels
Label Position
Position of the Data Label, options: Top, Center, Bottom

Default:
center
Label Offset Y
Label Offset X
Label fontsize


Default:
12px
Label Color


Default:
#fff
Zoom


Default:
false

Out-pins

uicomponent
apexcharts: pie chart

Basic pie chart

In-pins

series
labels
options

Out-pins

uicomponent
apexcharts: custom chart

Chart that can be completely customized

In-pins

options

Out-pins

uicomponent
customgraph: uptime chart

Uptime chart

In-pins

Name
Data
Each object in the data is a bar, specify a field in the object for the color, and connect it to the color field pin
Color field
Include in your object a field with a color,
Unavailability
When the selected field is filled in your object it will be used to calculate the uptime. This field needs to be a date/number with the total downtime in minutes
Date
This field will be used to dispaly the day
Unavailable info
Info why it was
Max
Max amount of bars in the chart

Default:
90
Default color
The color of the bar when the downtime/color field is not filled

Default:
green

Out-pins

uicomponent
apexcharts: line chart

Basic line chart

In-pins

Name
Data
X Axis
Y Axis
Row Colors
Sets the colors of the background rows

Default:
#fff
Data colors
Sets the colors of the lines
Title align
Align the title, options: Left, Center, Right

Default:
left
Height
Curve
Theme
Color palette
Changes the colors of the lines to presets made by Apexcharts

Default:
palette1
Line width


Default:
2
Marker size
Show data labels
Label fontsize


Default:
12px
Label Color


Default:
#fff
Zoom
When set to true the user can zoom in on the data

Default:
false

Out-pins

uicomponent