Line

Single or multi-series line chart. Best for showing trends over a continuous axis.

Series

Time range

Palette

Data shape

Pass this structure to the :data prop.

data shape

// Single series
[
    ['label' => 'Mon', 'value' => 230],
    ['label' => 'Tue', 'value' => 310],
]

// Multi-series
[
    ['name' => 'Revenue', 'data' => [['x' => 'Mon', 'y' => 400], ...]],
    ['name' => 'Target',  'data' => [['x' => 'Mon', 'y' => 350], ...]],
]

Usage

blade

<x-tayo::chart
    type="line"
    :data="$data"
    :height="420"
    colors="default"
/>

Bar Area