Diagramme

Donut share chart

Ein Donut aus fünf Scheiben mit einer hohlen Mitte und haarfeinen Lücken, der sich auf der Halterung öffnet und diejenige Scheibe anhebt, über der sich der Zeiger befindet.

Traffic by source

Last 30 days

38,000total

38,000 total across 5 categories.

Organic search leads at 48%.

Donut share chart verwenden

Ein Donut aus fünf Scheiben mit einer hohlen Mitte und haarfeinen Lücken, der sich auf der Halterung öffnet und diejenige Scheibe anhebt, über der sich der Zeiger befindet.

Teste die Vorschau mit Maus und Tastatur. Prüfe den sichtbaren Fokus und das Layout auf schmalen Bildschirmen in deiner eigenen Seite. Nenne deinem Agenten die Nummer oder den Bezeichner, um diese Komponente abzurufen.

Eigenschaften: accent, hueRange, holeRatio, gap, showTooltip

Welche Frameworks sind verfügbar?

Der Katalog enthält diese Versionen: react, vue, svelte, astro, html. Die Vorschau auf dieser Seite verwendet React.

Wie greife ich auf die Implementierung zu?

Code, Framework-Versionen und Installationsbefehle sind im Arbeitsbereich oben verfügbar.

Verbinde deinen Agenten

Ähnliche Komponenten

2403Plain Share PieDiagrammeDas Nötigste eines Kreisdiagramms: fünf bündige Abschnitte, ein dünner Trennstrich und ein Hover-Tooltip, ohne dass sonst etwas hinzugefügt wird.

2348Engraved label pieDiagrammeEin solides Kreisdiagramm, das jeden Kategorienamen in seinem eigenen Segment in einer invertierten Farbe einfügt, sodass die Aufschlüsselung ohne äußere Beschriftungen oder Führungslinien angezeigt wird.

2408Raised Slice DonutDiagrammeEin Donut, bei dem ein Slice dauerhaft über den Ring angehoben wird, indem sein Außenradius erweitert wird, und die Erhöhung beim Schweben zu jedem anderen Slice gleitet.

2420Seamless share pieDiagrammeEine feste Torte, deren Scheiben Kante an Kante miteinander verbunden sind und zwischen denen keine Lücken oder Striche vorhanden sind. Das Schweben ist also das Einzige, was verrät, wo ein Teil endet und der nächste beginnt.

1525Area chart liteDiagrammeEin reaktionsfähiges SVG-Flächendiagramm mit runden Achsenstrichen, einer Verlaufsfüllung, einem Fadenkreuz, das das Muster unter dem Zeiger liest, und einem Wischtuch zum Zeichnen.

2086Candle Price ChartDiagrammeEin OHLC-Kerzendiagramm mit farbigen Auf- und Abwärtskerzen, einem Docht pro Periode und einem Hover-Tooltip, der den Eröffnungs-, Höchst-, Tiefst- und Schlusskurs anzeigt.