Diagramme

Slice picker donut

Ein Donut, der durch ein Dropdown-Menü in seiner Kopfzeile gesteuert wird: Das ausgewählte Stück schiebt sich nach außen und bildet einen freistehenden äußeren Bogen, während das Loch die Nummer dieses Stücks anzeigt.

Weekly signups

Slice picker donut verwenden

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, holeRatio, raise, ringGap, hueRange

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?

Vorschau und Beschreibung sind öffentlich. Melde dich mit einem berechtigten Konto an, um Code, Framework-Versionen und Installation zu öffnen.

Verbinde deinen Agenten

Ähnliche Komponenten

2336Donut share chartDiagrammeEin 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.

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.

2337Donut with totalDiagrammeEin Donut-Diagramm, das die laufende Summe in ein eigenes Loch einfügt und diese Anzeige auf das Segment austauscht, auf dem sich der Mauszeiger befindet oder der fokussiert ist.

2273Highlighted bar chartDiagrammeEin Kategorie-Balkendiagramm, bei dem ein Balken mit einer gestrichelten Umrandung und einer helleren Füllung hervorgehoben wird und die Beschriftung dem Balken folgt, auf den Sie zeigen.

2456Twin ring chartDiagrammeZwei konzentrische Ringe, eine innere Scheibe und ein getrenntes äußeres Band, die auf einen Blick dieselben fünf Kategorien über zwei Zeiträume hinweg vergleichen.

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.