Cartão de Gráfico de Dispersão
A visão de correlação - um ponto por registro colocado por duas medidas, dimensionado por um terço quando os dados carregam um. Os pontos são agrupados em série para que cada coorte mantenha sua própria cor; pairando um troca o título para esse registro e escurece a outra série, e as legendas do eixo ficam sob o gráfico.
Revenue per account
742
+6.8%Instalação
O Cartão de Gráfico de Dispersão faz parte do BoardUI Pro.
Modo escuro pronto - este componente segue tokens semânticos BoardUI automaticamente. Configurar a mudança de tema.
Usando um pacote de UI compartilhado ou aliases de importação personalizados? Configure seus caminhos de instalação antes de executar o CLI. Exemplos de copy-paste usam as importações padrão.
Sem bolhas
Bubbles ligar automaticamente quando qualquer ponto carrega um z; passe bubble={false} para mesmo pontos quando a terceira medida não vale a pena codificar.
Dados
series é { label, points, color? }[] e cada ponto é { x, y, z?, label? }A questão é... label é o que o cabeçalho mostra no hover; as médias, a legenda e as peças são derivadas. A pílula do período é um dropdown quando você passa ranges.
// Points are grouped into series - each gets a colour, a legend row and a tile.// Any point carrying `z` turns the card into a bubble chart.<ScatterChartCard title="Revenue per account" series={[ { label: "Starter", points: [ { x: 12, y: 180, z: 40, label: "Acme" }, { x: 18, y: 240, z: 60, label: "Bolt" }, ], }, { label: "Growth", points: growthPoints, color: "var(--color-chart-6)" }, ]} axisLabels={["Sessions", "Revenue"]} // captions under the plot format={(n) => `$${n.toLocaleString()}`} // y measure formatX={(n) => `${n}k`} // x measure bubble={false} // force plain dots even when the data carries z tiles // average y per series below the chart/>