Pie

Proportional segments. Best for part-to-whole comparisons with a small number of categories.

Dataset

Palette

Data shape

Pass this structure to the :data prop.

data shape

[
    ['label' => 'Organic Search', 'value' => 42],
    ['label' => 'Direct',        'value' => 28],
    ['label' => 'Social',        'value' => 18],
    ['label' => 'Referral',      'value' =>  8],
]

Usage

blade

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

Area Donut