Numérique et sciences informatiques

Le format JSON

Le format JSON

Commençons avec ce fichier (csv) ouvert avec un éditeur de texte :

1
Prenom,Nom,Email,Age,Ville
2
Robert,Lepingre,bobby@exemple.com,41,Paris
3
Jeanne,Ducoux,jeanne@exemple.com,32,Marseille
4
Pierre,Lenfant,pierre@exemple.com,23,Rennes
5
Justine,Ptitegoutte,justine@totoche.com,10,Draguignan
6
Gerard,Manfain,gerard@exemple.com,15,Nice
7
Agathe,Zeublouse,agathe@exemple.com,18,Toulon
8
Ahmed,Epan,ahmed@totoche.com,19,Cannes

Il existe de nombreux site qui propose une conversion au format Json de fichiers csv :

Allons sur celui-là : CSV to JSON

  • Copiez et collez les lignes précédentes dans la partie gauche

  • Sélectionnez Hash

  • Et lancez la conversion

On obtient un fichier json dont les données sont encapsulées dans des accolades { } , ce sera un dictionnaire....

Téléchargez le fichier obtenu, et enregistrez le sous le nom : exemple.json

  • Réitérez l'opération, mais en sélectionnant Array

  • Enregistrez le fichier obtenu sous le nom : exemple_array.json

Les données sont cette fois-ci encapsulées dans des crochets : [ ] , ce sera une liste....

SimulationManipulations de bases

Dans Processing, glissez déposez le fichier : exemple.json

Celui-ci se trouve dans le dossier 'data' du sketch

On charge ce fichier , en utilisant la librairie 'json' de Python

1
import json
2
3
with open('data/exemple.json') as json_data:
4
    exemple_dict=json.load(json_data)
exemple_dict est du type dictionnaire , car les données sont encapsulées dans des accolades...
Ce dictionnaire contient des dictionnaires, car ....
1
import json
2
3
with open('data/exemple.json') as json_data:
4
    exemple_dict=json.load(json_data)
5
6
print(type(exemple_dict))
Faisons afficher les clés :
1
import json
2
3
with open('data/exemple.json') as json_data:
4
    exemple_dict=json.load(json_data)
5
6
print(type(exemple_dict))
7
8
print(exemple_dict.keys())
En sortie :
<type 'dict'>
[u'Ahmed', u'Pierre', u'Justine', u'Agathe', u'Gerard', u'Robert', u'Jeanne']
Ce dictionnaire est composés de dictionnaires...
Faisons afficher les sous-clés à l'une des clés :
1
import json
2
3
with open('data/exemple.json') as json_data:
4
    exemple_dict=json.load(json_data)
5
6
print(type(exemple_dict))
7
8
print(exemple_dict.keys())
9
print(exemple_dict['Ahmed'].keys())
En sortie :
<type 'dict'>
[u'Ahmed', u'Pierre', u'Justine', u'Agathe', u'Gerard', u'Robert', u'Jeanne']
[u'Email', u'Nom', u'Age', u'Ville']
Faisons afficher une valeur en particulier :
1
import json
2
3
with open('data/exemple.json') as json_data:
4
    exemple_dict=json.load(json_data)
5
6
print(type(exemple_dict))
7
8
print(exemple_dict.keys())
9
print(exemple_dict['Ahmed'].keys())
10
print(exemple_dict['Ahmed']['Nom'])
En sortie :
<type 'dict'>
[u'Ahmed', u'Pierre', u'Justine', u'Agathe', u'Gerard', u'Robert', u'Jeanne']
[u'Email', u'Nom', u'Age', u'Ville']
Epan
Faites afficher les valeurs concernant Ahmed Epan
SimulationExercice
Retrouver les valeurs concernant Ahmed Epan , avec le fichier : exemple_array.json
Attention, cette liste contient des dictionnaires
Pour rappel :
  • Pour accéder à un élément de la liste, on utilise son index : maliste[index]
  • Pour accéder à un élément d'un dictionnaire, on utilise une clé : maliste[index]['la-clé']
1
import json
2
3
with open('data/exemple_array.json') as json_data:
4
    exemple_array=json.load(json_data)
5
print(type(exemple_array))
6
7
# a compléter
1
import json
2
3
with open('data/exemple_array.json') as json_data:
4
    exemple_array=json.load(json_data)
5
print(type(exemple_array))
6
print(exemple_array[6])
7
print(exemple_array[6].keys())
8
print(exemple_array[6]['Nom'])
9
print(exemple_array[6]['Prenom'])
10
print(exemple_array[6]['Email'])
11
print(exemple_array[6]['Ville'])
12
print(exemple_array[6]['Age'])
Utiliser des données Json en ligne
Utilisation d'un fichier Json en ligne
Le site openweathermap donne l'accès à des données météo, moyennant l'obtention d'une clé API
Pour la suite il est préférable que vous obteniez votre propre clé API, cependant en voilà une créée pour les besoins de cet apprentissage
clé API (à n'utiliser que si vous n'avez pas encore la votre...): 8a96de29db2220174ce8e07bcc98f95d
Copiez et collez cette URL dans votre navigateur
1
http://api.openweathermap.org/data/2.5/weather?q=draguignan,fr&lang=fr&mode=json&APPID=8a96de29db2220174ce8e07bcc98f95d
Cela nous donne accès à un fichier Json, qui offre des données météo sur la ville de Draguignan en France...
  • Essayez avec une autre ville...
SimulationUn programme (Processing)
Nous allons écrire un programme qui affiche certaines de ces données
Observons dans un premier temps, la structure de ce fichier
1
{
2
"coord":{"lon":6.46,"lat":43.54},
3
"weather":[{"id":800,"main":"Clear","description":"ciel dégagé","icon":"01d"}],
4
"base":"stations",
5
"main":{"temp":284.7,"pressure":1005,"humidity":29,"temp_min":284.15,"temp_max":285.15},
6
"visibility":10000,
7
"wind":{"speed":11.3,"deg":320,"gust":16.5},
8
"clouds":{"all":0},
9
"dt":1547040600,
10
"sys":{"type":1,"id":6506,"message":0.2104,"country":"FR","sunrise":1547017590,"sunset":1547050593},
11
"id":3020850,
12
"name":"Draguignan",
13
"cod":200
14
}
Les données sont encapsulées dans des accolades {...}, ce qui nous donnera un dictionnaire une fois chargées.
De plus la clé "weather" est une liste [...] qui contient un seul élément : un dictionnaire.
Nous aurons besoin des bibliothèques :
  • json, pour traiter les fichiers json
  • urllib, pour traiter les URL
Ci-dessous le programme : commenté
Encore une fois : c'est mieux si vous utilisez votre propre clé API...
1
"""
2
Import de données json depuis openweathermap.
3
les données sont sous la forme d'un dictionnaire, contenant des dictionnaires et une liste
4
On charge ces dictionnaires dans des variables, pour accéder aux éléments
5
On fait afficher le tout dans une fenêtre
6
"""
7
# import des bibliothèques
8
import urllib
9
import json
10
11
# fonction pour remplacer la fonction input() de Python qui n'existe pas dans Processing
12
def input(message=''):
13
    from javax.swing import JOptionPane
14
    return JOptionPane.showInputDialog(frame,message)
15
16
# fonction pour l'action de la souris sur la zone recherche, cette action lance une boite de dialogue
17
def mouseClicked():
18
    global ville
19
    if  mouseX>320 and mouseX<width and mouseY>270 and mouseY<height:
20
        mot=input('Entrez un nom de ville')#appel de la boite de dialogue
21
        if mot:
22
            ville=mot.upper()
23
            application(ville)#appel de la fonction application avec le paramètre ville
24
25
def setup():
26
    size(500,300)
27
    background(0)
28
    global ville,url_param,reponse,reponsedict,temps,temperature,temp_degree,temp_max,temp_min,pression,humidite,icone,description,img,API_key
29
    ville='DRAGUIGNAN'
30
    API_key='8a96de29db2220174ce8e07bcc98f95d'
31
    application(ville)#1er appel de la fonction application
32
33
    
34
#############################  
35
# cette fonction  charge le fichier json obtenu avec l'url dans la variable reponse
36
# puis si tout se passe bien, on charge la reponse dans le dictionnaire reponse_dict ( grace à la bibliothèque json)
37
# puis on charge dans la variable temps, les valeurs de la clé 'weather'
38
# enfin on récupère les valeurs des clés  'icon' et 'description' dans les variables icone et description
39
# on charge ensuite l'image de l'icone dans la variable img
40
# en cas d'erreur, on affiche la raison de l'erreur dans la console, pour cela on récupère le message
41
# donné par le fichier json: c'est la valeur de la clé 'message'
42
##############################
43
def application(ville):
44
    global url_param,reponse,reponsedict,temps,icone,description,img,API_key
45
    url_param="http://api.openweathermap.org/data/2.5/weather?q="+ville+",fr&lang=fr&mode=json&APPID="+API_key
46
    reponse=urllib.urlopen(url_param).read()
47
    try:
48
        reponsedict=json.loads(reponse)
49
        temps=reponsedict['weather']
50
        icone=temps[0]['icon'] # on récupère la valeur de la clé 'icon' se trouvant à l'index 0 de la liste
51
        description=temps[0]['description']
52
        img=loadImage("http://openweathermap.org/img/w/"+icone+".png")
53
    except:
54
        erreur=reponsedict['message']
55
        print("sans doute une erreur")
56
        print(erreur)
57
        
58
 # affichage dans la fenêtre:
59
 # l'image
60
 # la ville
61
 # la description du temps 
62
 # la zone de recherche (cliquable)      
63
def draw():
64
    background(0)
65
    image(img,350,50,100,100)
66
    textSize(20)
67
    text(ville,50,30)
68
    text("Temps : " +description,50,100)
69
    fill(255)
70
    rect(420,270,80,30,10)
71
    fill(0)
72
    textSize(10)
73
    text("Rechercher",425,290)
74
    fill(255)
75
    
76
    
Le travail à réaliser : (Processing)
Faire en sorte que le programme affiche, la température, les températures max et min, la pression et le taux d'humidité
Il faut faire attention aux unités et les convertir si nécessaire.
Pour charger un nombre, il faut obliger Python a lire l'élément comme un nombre, par exemple : temp=float(temperature['temp'])
l'instruction float(élément), oblige la lecture en tant que float.
Pour faire afficher dans la fenêtre du texte et le contenu d'une variable, on utilise l'instruction , par exemple : text(unicode('Température : ',"utf-8")+str(temp_degree),50,130)
text(....,50,130) , texte à afficher aux coordonnées (50,130)
unicode(....) pour faire afficher le texte accentué
str(....) pour obliger le contenu à être lu comme un string
+ pour séparer le texte de la variable
Le corrigé
1
"""
2
Import de données json depuis openweathermap.
3
les données sont sous la forme d'un dictionnaire, contenant des dictionnaires et une liste
4
On charge ces dictionnaires dans des variables, pour accéder aux éléments
5
On fait afficher le tout dans une fenêtre
6
7
"""
8
import urllib
9
import json
10
11
# fonction pour remplacer la fonction input() de Python qui n'existe pas dans processing
12
def input(message=''):
13
    from javax.swing import JOptionPane
14
    return JOptionPane.showInputDialog(frame,message)
15
16
# fonction pour l'action de la souris sur la zone recherche
17
def mouseClicked():
18
    global ville
19
    if  mouseX>320 and mouseX<width and mouseY>270 and mouseY<height:
20
        mot=input('Entrez un nom de ville')#appel de la boite de dialogue
21
        if mot:
22
            ville=mot.upper()
23
            application(ville)
24
25
def setup():
26
    size(500,300)
27
    background(0)
28
    global ville,url_param,reponse,reponsedict,temps,temperature,temp_degree,temp_max,temp_min,pression,humidite,icone,description,img,API_key
29
    ville='DRAGUIGNAN'
30
    API_key='8a96de29db2220174ce8e07bcc98f95d'
31
    application(ville)
32
33
    
34
    
35
    
36
def application(ville):
37
    global url_param,reponse,reponsedict,temps,temperature,temp_degree,temp_max,temp_min,pression,humidite,icone,description,img,API_key
38
    url_param="http://api.openweathermap.org/data/2.5/weather?q="+ville+",fr&lang=fr&mode=json&APPID="+API_key
39
    reponse=urllib.urlopen(url_param).read()
40
    print(reponse)
41
    try:
42
        reponsedict=json.loads(reponse)
43
        temps=reponsedict['weather']
44
        temperature=reponsedict['main']
45
        #print(temperature)
46
        temp_degree=(float(temperature['temp'])-273)
47
        temp_max=(float(temperature['temp_max'])-273)
48
        temp_min=(float(temperature['temp_min'])-273)
49
        pression=temperature['pressure']
50
        humidite=temperature['humidity']
51
        #print(temp_degree)
52
        #print(temps)
53
        icone=temps[0]['icon']
54
        description=temps[0]['description']
55
        img=loadImage("http://openweathermap.org/img/w/"+icone+".png")
56
    except:
57
        erreur=reponsedict['message']
58
        print("sans doute une erreur")
59
        print(erreur)
60
        
61
        
62
def draw():
63
    #global ville,url_param,reponse,reponsedict,temps,temperature,temp_degree,temp_max,temp_min,pression,humidite,icone,description,img,API_key
64
    background(0)
65
    image(img,350,50,100,100)
66
    textSize(20)
67
    text(ville,50,30)
68
    text("Temps : " +description,50,100)
69
    text(unicode('Température :  ',"utf-8")+str(temp_degree),50,130)
70
    text(unicode("Température max :  ","utf-8")+str(temp_max),50,160)
71
    text(unicode("Température min :  ","utf-8")+str(temp_min),50,190)
72
    text("Pression :  "+str(pression),50,220)
73
    text(unicode("Humidité  :  ","utf-8")+str(humidite),50,250)
74
    fill(255)
75
    rect(420,270,80,30,10)
76
    fill(0)
77
    textSize(10)
78
    text("Rechercher",425,290)
79
    fill(255)
80
    
81
    
SimulationUne idée de projet...
Le site openfoodfacts.org, propose des données sur des produits alimentaires.
Ce site est alimenté par des consommateurs bénévoles
On peut avoir accès aux données (json) d'un produit si on connaît son code...
Par exemple essayez cette URL : https://fr.openfoodfacts.org/api/v0/produit/3270160860166.json dans votre navigateur
3270160860166 est le code de ce produit
Comme vous pouvez le constater il y a énormément de données....
En voici deux pour démarrer : (Processing)
  • Une image du produit
  • La masse de sucre pour 100g de produit
Le programme suivant affiche l'image et le taux de sucre
1
import urllib
2
import json
3
#url_param="https://fr.openfoodfacts.org/api/v0/produit/3029330003533.json"
4
#url_param="https://fr.openfoodfacts.org/api/v0/produit/00036559.json"
5
url_param="https://fr.openfoodfacts.org/api/v0/produit/3270160860166.json"
6
size(300,200)
7
reponse=urllib.urlopen(url_param).read()
8
reponsedict=json.loads(reponse)
9
dict1=reponsedict['product']
10
test=dict1['nutriments']
11
teneur=float(test['sugars_100g'])
12
img_url=dict1['image_small_url']
13
img=loadImage(img_url)
14
image(img,10,10)
15
print("la teneur en sucre de ce produit est de :"+str(teneur)+"g pour 100g")
On peut imaginer :
  • Un fichier texte contenant une liste de code de produit
  • En choisir un et faire afficher des données concernant ce produit
  • Imaginer un "jeu", ou on demande d'estimer le nombre de morceaux de sucre (ou de pincées de sel) que contient un produit...
  • Faire afficher la liste des ingrédients....
PrécédentPrécédentSuivantSuivant
AccueilAccueilImprimerImprimer
								Stéphan Van Zuijlen
								Licence de documentation libre GNURéalisé avec Scenari (nouvelle fenêtre)