Pie Chart

Show parts of a whole. Market share, budget allocation, survey distribution — when the total matters as much as the pieces.

$ npx flitter-ui add pie-chart
GalleryAPI Reference
Quick Start
import PieChart from "./charts/pie-chart";
import Widget from "@flitterjs/react";

const chart = PieChart({
  data: {
    datasets: [
      {
        legend: "Market Share",
        data: [
          { label: "Chrome", value: 65 },
          { label: "Safari", value: 18 },
          { label: "Firefox", value: 10 },
          { label: "Edge", value: 7 },
        ],
      },
    ],
  },
});

<Widget widget={chart} width={600} height={400} />

See Integration guide for Svelte, vanilla JS, and more options.