Comment utiliser Google Charts avec 4D

Traduit automatiquement de Deepl

Selon les neuroscientifiques, nous réagissons mieux et plus rapidement à une forme visuelle qu’à tout autre type de représentation. C’est pourquoi les graphiques et les diagrammes sont clairement la clé d’une meilleure compréhension des données.

Si vous souhaitez afficher des diagrammes à barres, des histogrammes ou des camemberts modernes et entièrement compatibles avec les principaux navigateurs, mais aussi plus adaptés à la manière dont le cerveau humain traite les informations, Google Charts est une solution possible. Les types de graphiques disponibles dans Google Charts sont variés : outre les classiques diagrammes à barres/colonnes/triangles, Google Charts propose également des graphiques élaborés tels que les diagrammes Treemap, Candlestick et Gauge.

Cet article de blog fournit un exemple de diagramme à donuts, de carte et de diagramme à barres. Chaque graphique affiche la population par pays en Amérique du Sud. Dans la base de données suivante, vous disposez de la méthode 4D pour récupérer les données ainsi que de plusieurs fichiers HTML pour afficher les différents graphiques.

Exemple de base de données

Format des données

Cette base de données est très simple. Une seule méthode, GetJsonData, est nécessaire pour renvoyer un tableau de données JSON conforme aux spécifications de Google Chart.

Dans les trois exemples de graphiques suivants, le format des données est le même, comme indiqué ci-dessous :

{
   "Data":[
      ["Country", "Population"],
      ["Argentina", 43847277],
      ["Bolivia", 10888402],
      ["Brazil", 209567920],
      ["Chile", 18131850],
      ["Colombia", 48654392],
      ["Ecuador", 16385450],
      ["Gabon", 1763142],
      ["Guyana", 77061],
      ["Paraguay", 6725430],
      ["Peru", 31774225],
      ["Suriname", 54761],
      ["Uruguay", 3444071],
      ["Venezuela", 31518855]
   ]
}

Graphique en forme de beignet

Vous trouverez l’exemple de graphique en forme de donut dans le fichier « donutChart.html » du WebFolder.

An example of donut chart with Google Chart

Pour plus d’informations, veuillez vous reporter à la documentation sur les diagrammes de tarte de Google Charts.

Graphique en carte

Vous trouverez un exemple de diagramme de carte dans le fichier « geoChart.html » du WebFolder.

An example of Geo chart with google chart

Pour plus de détails, veuillez vous référer à la documentation sur les cartes géographiques de Google Charts.

Graphique en barres

Vous pouvez trouver l’exemple d’un diagramme à barres dans le fichier « barChart.html » du WebFolder.

An example of bar chart with Google Chart

Pour plus de détails, veuillez vous référer à la documentation sur les graphiques en barres de Google Charts.

Vanessa Talbot
- Product Owner -Vanessa Talbot a rejoint l'équipe du programme 4D en juin 2014. En tant que Product Owner, elle est chargée de rédiger les user stories puis de les traduire en spécifications fonctionnelles. Son rôle est également de s'assurer que l'implémentation des fonctionnalités livrées répond aux besoins des clients.Depuis son arrivée, elle a travaillé à la définition des fonctionnalités clés de 4D. Elle a travaillé sur la plupart des nouvelles fonctionnalités de multithreading préemptif et aussi sur un sujet très complexe : la nouvelle architecture pour les applications enginées. Vanessa est diplômée de Telecom Saint-Etienne. Elle a commencé sa carrière à l'Institut de Recherche Criminelle en tant que développeur pour le département audiovisuel. Elle a également travaillé dans les domaines des médias et du médical en tant qu'experte en support technique, en production ainsi qu'en documentation de nouvelles fonctionnalités.