BjChartPie

Camembert / donut React : data, donut, centerText, size — aligné sur la version Vue.

Utilisation

import { BjChart, BjChartPie } from '@flrxnt/dsbj/react'

const data = [
  { label: 'Direct', value: 45, color: '#008751' },
  { label: 'Recherche', value: 30, color: '#FCD116' },
  { label: 'Réseaux', value: 25, color: '#E8112D' },
]

export function Example() {
  return (
    <BjChart title="Sources de trafic">
      <BjChartPie data={data} donut centerText="100%" />
    </BjChart>
  )
}

Camembert plein

Sans prop donut, disque plein.

<BjChartPie data={data} />

Donut + texte central

donut et centerText ensemble pour le résumé au centre.

<BjChartPie data={data} donut centerText="72%" />

Tailles

size ajuste le viewBox carré.

<BjChartPie data={data} size={280} />

Couleurs

Chaque entrée fournit sa couleur de remplissage.

Combinaison

Donut, libellé central et taille réduite.

<BjChartPie data={data} donut centerText="Total" size={160} />

Props

Prop	Description
`data`	Tranches avec <code class="bj-code">label</code>, <code class="bj-code">value</code>, <code class="bj-code">color</code>.
`donut`	Mode donut.
`centerText`	Texte central (donut).
`size`	Côté du viewBox (défaut 200).
`…`	Props sur le conteneur.