ScoreRing
Wynik względem znanego maksimum, na przykład wynik audytu na 100 punktów. Wybierz go dla od jednego do czterech głównych wyników; dla poziomów na liście użyj Meter z grupy feedback.
- ScoreRing
PodglądLink do sekcji Podgląd
Na żywo we wszystkich trzech motywach. Wszystko tutaj jest interaktywne.
Dzień, podgląd: ScoreRing
PerformanceGood
AccessibilityNeeds work
Best practicesPoor
SearchNot measured yet
Checklist
Noc, podgląd: ScoreRing
PerformanceGood
AccessibilityNeeds work
Best practicesPoor
SearchNot measured yet
Checklist
Wysoki kontrast, podgląd: ScoreRing
PerformanceGood
AccessibilityNeeds work
Best practicesPoor
SearchNot measured yet
Checklist
UżycieLink do sekcji Użycie
import { ScoreRing } from '@skribly/ui/charts'<ScoreRing value={92} label="Accessibility" showLabel ratingLabels={{ good: 'Good', fair: 'Needs work', poor: 'Poor' }} />Każda etykieta jest propem, więc aplikacja przekazuje własne słowa we własnym języku. Zobacz zasadę brak wbudowanego tekstu.
DostępnośćLink do sekcji Dostępność
- Miernik nazwany przez label, z wartością i zakresem.
- Ocena jest słowem z własnym kształtem ikony, powiązanym jako opis, więc kolor nigdy nie jest jedynym sygnałem.
- Bez wyniku pierścień jest pusty, pokazuje kreskę i odczytuje emptyLabel.
- Pierścień animuje się tylko wtedy, gdy ruch nie jest ograniczony, a w trybie wymuszonych kolorów używa Highlight.
Ten przykład przechodzi przez axe we wszystkich trzech motywach przy każdym uruchomieniu testów. Zobacz, co sprawdzają testy.