Utilisation de Highcharts

Ouvrez la QuickSight console.

Ouvrez l' QuickSight analyse à laquelle vous souhaitez ajouter un visuel Highcharts.

Sur la barre d'application, sélectionnez Ajouter, puis Ajouter une représentation visuelle.

Dans le volet Types visuels, choisissez l'icône visuelle Highcharts. Un visuel vide apparaît sur la feuille d'analyse et le volet Propriétés s'ouvre sur la gauche.

Dans le volet Propriétés, développez la section Paramètres d'affichage et effectuez les actions suivantes :

1. Pour Modifier le titre, choisissez l'icône représentant un pinceau, entrez le titre que vous souhaitez attribuer au visuel, puis sélectionnez ENREGISTRER. Vous pouvez également choisir l'icône en forme de globe oculaire pour masquer le titre.

2. (Facultatif) Pour Modifier le sous-titre, choisissez l'icône représentant un pinceau, entrez le sous-titre que vous souhaitez attribuer au visuel, puis sélectionnez ENREGISTRER. Vous pouvez également choisir l'icône en forme de globe oculaire pour masquer le sous-titre.

3. (Facultatif) Pour le texte alternatif, ajoutez le texte alternatif que vous souhaitez inclure dans le visuel.

Développez la section Limite de points de données. Dans Nombre de points de données à afficher, entrez le nombre de points de données que vous souhaitez afficher dans le visuel. Les visuels Highcharts peuvent afficher jusqu'à 10 000 points de données.

Développez la section Code graphique, illustrée dans l'image suivante.

Entrez un schéma JSON dans l'éditeur JSON de code graphique. L'éditeur fournit une assistance contextuelle et une validation en temps réel pour garantir que le JSON d'entrée est correctement configuré. Toutes les erreurs QuickSight identifiées peuvent être consultées dans la liste déroulante des erreurs. L'exemple ci-dessous montre un schéma JSON qui crée un graphique à lèvres indiquant les ventes de l'année en cours par secteur d'activité.

{
  "xAxis": {
    "categories": ["getColumn", 0]
  },
  "yAxis": {
    "min": 0,
    "title": {
      "text": "Amount ($)"
    }
  },
  "tooltip": {
    "headerFormat": "<span style='font-size:10px'>{point.key}</span><table>",
    "pointFormat": "<tr><td style='color:{series.color};padding:0'>{series.name}: </td><td style='padding:0'><b>${point.y:,.0f}</b></td></tr>",
    "footerFormat": "</table>",
    "shared": true,
    "useHTML": true
  },
  "plotOptions": {
    "column": {
      "borderWidth": 0,
      "grouping": false,
      "shadow": false
    }
  },
  "series": [
    {
      "type": "column",
      "name": "Current Year Sales",
      "color": "rgba(124,181,236,1)",
      "data": ["getColumn", 1],
      "pointPadding": 0.3,
      "pointPlacement": 0.0
    }
  ]
}

Choisissez APPLIQUER LE CODE. QuickSight convertit le schéma JSON en un visuel qui apparaît dans l'analyse. Pour apporter des modifications au visuel rendu, mettez à jour les propriétés appropriées dans le schéma JSON et choisissez APPLIQUER LE CODE. L'image ci-dessous montre le graphique du rouge à lèvres créé avec le schéma JSON de l'étape précédente.

(Facultatif) Ouvrez le menu déroulant Référence pour accéder à des liens vers des documents de référence Highctarts utiles.