Guide rapide et simple pour créer un graphique avec une seule URL
Ne serait-ce pas formidable de créer un graphique avec une seule URL ? Vous pouvez désormais le faire grâce à l'interface ultra-simple d'Image Charts. Créer des graphiques avec une seule URL, dotés d'un large éventail de fonctionnalités, n'a jamais été aussi facile. Voici quelques étapes simples pour vous montrer comment procéder.
Lorsque vous effectuez une requête POST ou GET par URL, l'API Image Chart fournit une image de graphique. Le API est capable de tracer toutes sortes de diagrammes tels que radar, barres, courbes, secteurs et bien d'autres encore. L'URL englobe des attributs importants du diagramme comme les libellés, les couleurs, la taille, les données et d'autres facteurs.
Vous pouvez construire le graphique le plus simple possible en spécifiant la taille, les données et le type de graphique dans l'URL. Si vous préférez, vous pouvez saisir cette URL directement dans votre navigateur. Si vous voulez pointer vers ce graphique sur votre page web, vous devrez alors utiliser la balise <img>.
Format d'URL
certains éléments sont inclus dans la plupart des graphiques. Les URL de graphique partagent le format présenté ci-dessous.
https://image-charts.com/chart
?cht=<chart_type>
&chd=<chart_data>
&chs=<chart_size>
&...additional_parameters…
La chaîne de caractères https://image-charts.com/chart? est la clé de tous les graphiques, car elle se trouve au début de toutes les URL de graphique. Cette chaîne de caractères est suivie de paramètres qui définissent les visuels et les données du graphique. Les paires de paramètres nom=valeur doivent être séparées par une esperluette. Après le point d'interrogation présent dans la chaîne ci-dessus, vous pouvez définir les attributs dans l'ordre de votre choix. Au minimum, vous aurez besoin de ces paramètres pour compléter l'URL du graphique : chs (pour la taille du graphique), chd (pour les données à afficher dans le graphique) et cht (pour le type de graphique).
Vous pouvez aussi spécifier plusieurs autres paramètres pour donner un sens supplémentaire à votre graphique, qui le feront prendre vie et transmettront des informations importantes aux autres dans un format pratique et simple. Vous pouvez inclure tous les paramètres pris en charge par le type de graphique.
Un regard plus approfondi sous le capot
Voici un exemple de lien qui illustre certains de ces principes.
https://image-charts.com/chart
?cht=p3
&chs=700x100
&chd=t:60,40
&chl=Hello|World
&chan
&chf=ps0-0,lg,45,ffeb3b,0.2,f44336,1|ps0-1,lg,45,8bc34a,0.2,009688,1
Examinons chaque partie de cette URL étape par étape afin que vous compreniez comment elle permet de définir les attributs importants de votre graphique.
https://image-charts.com/chart?
Comme mentionné précédemment, il s'agit de la partie initiale de l'URL du graphique, commune à tous. Cependant, si vous souhaitez afficher plusieurs graphiques sur différentes pages, vous devrez peut-être apporter quelques modifications à ce format. Cette technique avancée vous aidera à améliorer la vitesse de chargement des graphiques et les performances de la page.
cht = p3
Ce fragment spécifie le type de graphique, en l'occurrence graphique en secteurs.
chs = 700 x 100
C'est la taille du graphique, exprimée en pixels. La largeur est de 700 pixels tandis que la hauteur est de 100 pixels.
chd = t : 60 , 40
Ce sont les données du graphique. Ce format spécifie les données sous une forme textuelle simple. Il existe aussi d'autres formats disponibles pour afficher les données plus commodément.
ch1 = Hello | World
Ces étiquettes désignent deux tranches différentes du camembert.
chan
L'attribut chan anime le rendu du graphique en le transformant en GIF.
chf = ps
un dégradé linéaire pour chaque tranche de camembert est spécifié dans cette chaîne.
&
Le signe esperluette est utilisé pour séparer les différents attributs.
Vous avez maintenant une idée des bases de la création de graphiques avec 1 URL sur une interface très simple. Il vous suffit de spécifier les différents attributs dans l'URL. L'API Image Chart transformera cette URL en un graphique qui vous aide à transmettre l'information souhaitée sous la bonne forme.
Créez vos propres graphiques en une seule URL
Vous devez savoir comment les attributs sont écrits dans l'URL. C'est un exercice simple qui ne vous prendra pas plus de quelques minutes. Vous pouvez créer votre propre aide-mémoire qui montre comment chaque attribut est spécifié dans l'URL. Avec la pratique, vous deviendrez plus à l'aise avec les attributs et n'aurez plus besoin de vous appuyer sur l'aide-mémoire pour vous rappeler comment les attributs de graphique sont spécifiés.
Pour vous exercer, vous pouvez commencer à modifier cette URL et observer l'effet de chaque changement sur votre camembert. Commencez par copier-coller l'URL de l'image chart dans la barre d'adresse de votre navigateur.
Vous pouvez essayer quelques changements pour voir comment ils fonctionnent. Par exemple, vous pouvez créer davantage de tranches en ajoutant plus de valeurs de données, en veillant à ajouter des virgules entre elles. Vous pouvez aussi spécifier les étiquettes de toutes les tranches que vous créez. Pour chaque valeur, veillez à ajouter le signe | entre chacune. Vous pouvez aussi essayer un graphique plus grand en spécifiant des valeurs de pixels supérieures.
Image Charts a aidé certaines des plus grandes marques à collaborer plus efficacement grâce à son interface ultra-simple. Même les débutants complets peuvent se familiariser rapidement grâce à nos tutoriels courts et simples disponibles dans le hub de développement.
Besoin d'aide pour créer des graphiques à l'aide d'une adresse URL ? Nous serions ravis de vous aider, comme nous l'avons fait pour de nombreuses autres personnes avant vous.
Cliquez ici pour en savoir plus.
