Graphiques - Scénarios d'essai spécifiques
Vous cherchez la BOEW v3.1?
À partir du 23 septembre 2014, la version 3.1 de la Boîte à outils de l'expérience Web n'est plus supportée. Le code source et la documentation ont été déplacés vers le dépôt wet-boew-legacy.
- Graphiques - Simple
- Étiquettage et valeur de référence
- Personalisation, préréglages personnalisés et plusieurs types de graphique
- Personalisation de diagrame circulaire
- Séparateur des milliers
- Fonctions personalisés dans vos préréglages
Diagrame circulaire à 100 %
Le graphique suivant devrait être un cercle plein d'où la légende contient seulement une valeur. Le texte mis en évidence dans le titre du tableau devrait être copier dans le titre du graphique (<figcaption>
) et aussi dans le lien contenu dans l'élément (<summary>
) afin de consulter le tableau.
<table class="wb-charts wb-charts-pie table">
Valeur | |
---|---|
Voiture | 125 |
Étiquette et tableau analysé à contre sens
Les deux graphique suivant devrait produire le même graphique avec les étiquettes suivante:
- Besoins externe, à la position de l'axe des x de 0 à 2
- Besoins redirigé, à la position de l'axe des x 2 à 4
- Besoins interne, à la position de l'axe des x 4 à 6
<table class="wb-charts table" data-wb-charts='{"labelposition": 1, "noencapsulation": true}'>
Besoins externe | Besoins redirigé | Besoins interne | ||||
---|---|---|---|---|---|---|
Éducative | Tâches | Navigation | Soutien | Information | Entreprise | |
Général | 2 | 0 | 20 | 4 | 100 | 50 |
Étudiants | 2 | 2 | 1 | 5 | 50 | 0 |
Entreprise | 60 | 10 | 20 | 90 | 50 | 8 |
Professionnel | 46 | 26 | 5 | 101 | 200 | 142 |
Avocat | 0 | 2 | 4 | 0 | 300 | 300 |
<table class="wb-charts table" data-wb-charts='{"labelposition": 1, "noencapsulation": true, "reversettblparsing": true}'>
Général | Étudiants | Entreprise | Professionnel | Avocat | ||
---|---|---|---|---|---|---|
Besoins externe | Éducative | 2 | 2 | 60 | 46 | 0 |
Tâches | 0 | 2 | 10 | 26 | 2 | |
Besoins redirigé | Navigation | 20 | 1 | 20 | 5 | 4 |
Soutien | 4 | 5 | 90 | 101 | 0 | |
Besoins interne | Information | 100 | 50 | 50 | 200 | 300 |
Entreprise | 50 | 0 | 8 | 142 | 300 |
Diagrame circulaire et tableau analysé à contre sens
Les deux tableaux suivant devrait produire le même diagrame circulaire. Il est possible que la largeur de chaques graphique soit différent.
<table class="wb-charts wb-charts-pie table" data-wb-charts='{ "height": 500, "decimal": 1 }'>
Général | Étudiants | Entreprise | Professionnel | Avocat | |
---|---|---|---|---|---|
Tâches | 0 | 2 | 10 | 26 | 2 |
Veuillez prendre note que l'éléments <colgroup>
est requis afain de créer le graphique subséquant.
<table class="wb-charts wb-charts-pie table" data-wb-charts='{ "height": 500, "decimal": 1, "reversettblparsing": true }'>
Tâches | |
---|---|
Général | 0 |
Étudiants | 2 |
Entreprise | 10 |
Professionnel | 26 |
Avocat | 2 |
<caption>Nombre de page ayant une tâche comme objectif principal et par audience</caption>
<colgroup><col /></colgroup>
<colgroup><col /></colgroup>
<tr>
<td></td>
<th>Tâches</th>
</tr>
- Date de modification :