Des mots dans des tailles qui suivent leur poids. Les tags peuvent être des liens, des boutons qui sélectionnent ou du texte simple.
Pourquoi c’est utile
- Taille selon le poids
- Liens ou boutons
- Aperçu rapide
Où il trouve sa place
- Sujets
- Mots-clés
- Recherches populaires
Exemple
<TagCloud Label="Topics" Tags="_tags" Selected="_picked" OnTagClick="Pick" />
<p>@(_picked.Count == 0 ? "Click a tag to select it." : "Selected: " + string.Join(", ", _picked))</p>
@code {
private readonly List<string> _picked = new();
private readonly TagCloudItem[] _tags =
{
new("Blazor", 42), new("Accessibility", 31), new("Charts", 25), new("Forms", 18), new("Themes", 14),
new("Localization", 11), new("Grids", 36), new("Scheduling", 9), new("Maps", 6), new("Reports", 12), new("Icons", 4)
};
private void Pick(TagCloudItem tag)
{
if (!_picked.Remove(tag.Text)) _picked.Add(tag.Text);
}
}Un court fragment. Ajoutez @using RayCraft.Blazor.Components à votre page et utilisez un mode de rendu interactif.
Inclus dans RayCraft Free. Des exemples fonctionnels se trouvent dans le dépôt GitHub (MIT); il contient du code d’exemple et de démonstration, pas le code de la bibliothèque.