Line Chart
To create a line chart in vue3-charts you can use the Line
layer. You can add the Line
layer multiple times or combine it with other layers (Bar
, Area
).
Here you can see a simple example using two Line
layers.
Chart
Code
Data
Line Props
The line layer allows a number of properties to be specified.
Name
Type
Description
lineStyle
Object
Use lineStyle to set svg styling for the line.
Ex:
- stroke (ex. red)
- strokeWidth
- strokeLinecap
- strokeDasharray
dotStyle
Object
Same as
lineStyle
but applyes to line dot. dataKeys
Array
What data the line to render.
Ex:
['name', 'pl']
type
normal
step
natural
monotone
Set how to draw the line.