Maison > Article > développement back-end > ECharts et Golang : conseils et expériences pour créer des graphiques statistiques pratiques
ECharts et golang : Compétences et expérience dans la création de graphiques statistiques pratiques, des exemples de code spécifiques sont nécessaires
Avec la popularité du traitement des données, la visualisation des données est devenue une compétence essentielle dans de nombreux domaines d'application. Et des outils pour réaliser des graphiques ont également vu le jour. ECharts est un outil de visualisation de données open source et Golang est un langage à haute efficacité et à haute concurrence. La combinaison des deux peut créer des graphiques efficaces et pratiques.
Cet article présentera les compétences et l'expérience liées à l'utilisation d'ECharts et de Golang pour créer des graphiques statistiques pratiques et fournira des exemples de code spécifiques.
package main import ( "encoding/json" "net/http" ) type Data struct { Label string `json:"label"` Value int `json:"value"` } func main() { http.HandleFunc("/", func(w http.ResponseWriter, r *http.Request) { data := []Data{ {"January", 10}, {"February", 20}, {"March", 30}, {"April", 25}, {"May", 15}, {"June", 5}, } jsonData, err := json.Marshal(data) if err != nil { http.Error(w, err.Error(), http.StatusInternalServerError) return } w.Header().Set("Content-Type", "application/json") w.Write(jsonData) }) http.ListenAndServe(":8080", nil) }
<!DOCTYPE html> <html> <head> <title>Chart Example</title> <script src="https://cdn.staticfile.org/echarts/4.1.0/echarts.min.js"></script> </head> <body> <div id="chart" style="width: 600px;height:400px;"></div> <script src="chart.js"></script> </body> </html>
Nous avons introduit ECharts dans la balise head et placé un div dans le corps pour héberger le graphique. Dans le même temps, nous avons également introduit un fichier js nommé « chart.js » pour charger des données et dessiner des graphiques.
fetch('/').then(function(response) { return response.json(); }).then(function(data) { var chartDom = document.getElementById('chart'); var myChart = echarts.init(chartDom); var option; option = { title: { text: 'My Chart', left: 'center', }, tooltip: {}, xAxis: { data: data.map(function(item) { return item.label; }) }, yAxis: {}, series: [{ type: 'bar', data: data.map(function(item) { return item.value; }) }] }; if (option && typeof option === "object") { myChart.setOption(option, true); } });
Le code utilise la fonction fetch pour demander des données et la méthode json() pour analyser les données de réponse dans un objet json. Nous avons ensuite créé une instance ECharts et défini un titre, une info-bulle, des axes X/Y et une série de barres pour le graphique.
Ce qui précède est un exemple de base d'utilisation d'ECharts et de Golang pour créer des graphiques statistiques pratiques. Si vous avez besoin de créer des graphiques plus complexes, vous pouvez trouver les options de configuration appropriées dans la documentation officielle d'ECharts et utiliser Golang pour gérer les données. Avec des essais et une pratique constants, vous serez en mesure de créer des graphiques à la fois très pratiques et beaux.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!