Gallery

Cloud Infrastructure Spend

Toast
$ npx flitter-ui add donut-chart --toast

Code

import ToastDonutChart from "@/components/flitter/charts/toast-donut-chart";

const chart = ToastDonutChart({
  data: {
    datasets: [
      { name: "AWS", value: 32 },
      { name: "Azure", value: 23 },
      { name: "Google Cloud", value: 11 },
      { name: "Alibaba", value: 5 },
      { name: "Oracle", value: 4 },
      { name: "Other", value: 25 },
    ],
  },
  config: {
    legend: { visible: false },
    radial: { visible: false },
  },
});

Related Charts