Modifier le contenu d'un fichier JSON

Javascript

Le problème exposé dans ce sujet a été résolu.

Bonjour,

j’ai un code, qui utilise la lib ChartJS. Voici le code du index.html:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <link rel="stylesheet" type="text/css" href="./index.css">
    <title>ChartJS</title>
</head>
<body>

<canvas id="myChart"></canvas>

<script src="./chart.js"></script>



<script>
var ctx = document.getElementById("myChart");
ctx.height = 25;
ctx.width = 100;
var myChart = new Chart(ctx, {
    "type": "line",
    "data": {
        "labels": [
            "28 June 14:01",
            "28 June 21:28",
            "29 June 16:58",
            "29 June 17:05"
        ],
        "datasets": [
            {
                "label": "Temps de jeu",
                "data": [
                    {
                        "x": 1530187288,
                        "y": 3
                    },
                    {
                        "x": 1530214139,
                        "y": 10
                    },
                    {
                        "x": 1530284326,
                        "y": 4
                    },
                    {
                        "x": 1530284721,
                        "y": 7
                    }
                ],
                "backgroundColor": [
                    "rgba(255, 99, 132, 0.2)",
                    "rgba(255, 99, 132, 0.2)",
                    "rgba(255, 99, 132, 0.2)",
                    "rgba(255, 99, 132, 0.2)"
                ],
                "borderColor": [
                    "rgba(255, 99, 132, 1)",
                    "rgba(255, 99, 132, 1)",
                    "rgba(255, 99, 132, 1)",
                    "rgba(255, 99, 132, 1)"
                ],
                "borderWidth": 1
            }
        ]
    },
    "options": {
        "scales": {
            "yAxes": [
                {
                    "ticks": {
                        "beginAtZero": true
                    }
                }
            ],
            "xAxes": [
                {
                    "ticks": {
                        "min": 1530187288,
                        "max": 1530284721
                    },
                    "type": "linear"
                }
            ]
        }
    }
});

</script>





</body>
</html>

Ensuite, j’ai un index.js :

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
const fs = require('fs');


fs.readFile('./data.json', (err, data) => {
const obj = JSON.parse(data);
const tp1 = obj.data.datasets[0].data[0].x
const minDate = new Date(tp1 * 1000);
const days = ["Lundi", "Mardi", "Mercredi", "Jeudi", "Vendredi", "Samedi", "Dimanche"];
const months = ["Janvier", "Février", "Mars", "Avril", "Mai", "Juin", "Juillet", "Août", "Septembre", "Octobre", "Novembre", "Décembre"];
const hour = minDate.getHours();
const minute = minDate.getMinutes(tp1);
const date = minDate.getDate();

if (err) {
    if (err.code === "ENOENT") {
        console.error('File doesnt exist');
        return;
    }


    throw err
}



console.log(tp1)
console.log(`${days[minDate.getDay()]} ${date} ${months[minDate.getMonth()]} ${(hour)%24}:${minute}`)

})

Comme vous pouvez le voir, j’ai créer un programme qui permet de convertir un timestamp en par exemple: "30 June 11:31".

Le problème est que, la page HTML est ainsi :

Image utilisateur

Merci et bonne journée !

Je comprends pas ce que tu cherches à faire au juste… à quoi correspondent les axes ? Quelles données tu affiches et sous quel format tu les veux ?

viki53

En fait, j’accède à :

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
                    {
                        "x": 1530187288,
                        "y": 3
                    },
                    {
                        "x": 1530214139,
                        "y": 10
                    },
                    {
                        "x": 1530284326,
                        "y": 4
                    },
                    {
                        "x": 1530284721,
                        "y": 7
                    }

Puis, je convertis les "x" en mois:jour:heure. Maintenant, j’aimerais que les timestamps soient justement remplacés par mois:jour:heure dans le fichier.html.

Merci.

C’est bon, j’ai réussi !

Voici le code :

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
const fs = require('fs');


fs.readFile('./data.json', (err, data) => {
const obj = JSON.parse(data);
const tp1 = obj.data.datasets[0].data[0].x
const minDate = new Date(tp1 * 1000);
const days = ["Lundi", "Mardi", "Mercredi", "Jeudi", "Vendredi", "Samedi", "Dimanche"];
const months = ["Janvier", "Février", "Mars", "Avril", "Mai", "Juin", "Juillet", "Août", "Septembre", "Octobre", "Novembre", "Décembre"];
const hour = minDate.getHours();
const minute = minDate.getMinutes(tp1);
const date = minDate.getDate();
obj.data.datasets[0].data[0].x = "153018728558";

if (err) {
    if (err.code === "ENOENT") {
        console.error('File doesnt exist');
        return;
    }


    throw err
}



console.log(tp1)
console.log(`${days[minDate.getDay()]} ${date} ${months[minDate.getMonth()]} ${(hour)%24}:${minute}`)

})
Connectez-vous pour pouvoir poster un message.
Connexion

Pas encore membre ?

Créez un compte en une minute pour profiter pleinement de toutes les fonctionnalités de Zeste de Savoir. Ici, tout est gratuit et sans publicité.
Créer un compte