


Bermula dari awal: menggunakan ECharts dan golang untuk mencipta carta statistik yang cantik
Mula dari awal: Gunakan ECharts dan golang untuk mencipta carta statistik yang cantik
Dalam era visualisasi data, carta statistik telah menjadi alat penting untuk memaparkan data. Sebagai perpustakaan sumber terbuka yang berkuasa dan mudah digunakan, ECharts menyediakan kami dengan pelbagai jenis carta dan gaya carta yang kaya. Digabungkan dengan golang, bahasa pengaturcaraan yang cekap dan berkuasa, kami boleh mencipta carta statistik yang cantik dan interaktif dengan mudah.
Artikel ini akan membawa anda dari awal untuk mencipta carta statistik mudah menggunakan ECharts dan golang. Kami akan menggunakan golang sebagai bahasa hujung belakang untuk mendapatkan data dan menghantarnya ke pustaka ECharts pada bahagian hadapan untuk menjana carta. Mari mulakan!
Pertama, kita perlu memasang perpustakaan golang dan ECharts. Jika anda belum memasang golang lagi, anda boleh memuat turun dan memasangnya dari laman web rasmi: https://golang.org/
Seterusnya, kami perlu memasang perpustakaan ECharts, anda boleh mencari kaedah pemasangan dalam dokumentasi rasmi daripada ECharts: https:/ /echarts.apache.org/zh/index.html
Selepas pemasangan, kami mencipta projek golang baharu dan mencipta fail bernama main.go
dalam direktori projek. main.go
的文件。
第一步,我们需要导入必要的golang包:
package main import ( "encoding/json" "fmt" "net/http" )
第二步,我们创建一个简单的数据结构,表示我们的统计数据:
type Data struct { Label string `json:"label"` Value int `json:"value"` }
第三步,我们创建一个handler函数来处理HTTP请求,并将数据以JSON格式返回给前端:
func handler(w http.ResponseWriter, r *http.Request) { data := []Data{ {Label: "Apple", Value: 10}, {Label: "Banana", Value: 20}, {Label: "Orange", Value: 15}, } jsonData, err := json.Marshal(data) if err != nil { fmt.Println("Error:", err) return } w.Header().Set("Content-Type", "application/json") w.Write(jsonData) }
第四步,我们创建一个main函数,并启动一个HTTP服务器来监听请求:
func main() { http.HandleFunc("/data", handler) http.ListenAndServe(":8080", nil) }
接下来,我们回到ECharts的前端部分。在项目目录下创建一个名为index.html
的文件,并在其中加入以下代码:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>ECharts Example</title> <script src="https://cdn.jsdelivr.net/npm/echarts@5.1.2/dist/echarts.min.js"></script> </head> <body> <div id="chart" style="width: 600px; height: 400px;"></div> <script> fetch('/data') .then(response => response.json()) .then(data => { const chart = echarts.init(document.getElementById('chart')); const options = { xAxis: { type: 'category', data: data.map(item => item.label), }, yAxis: { type: 'value', }, series: [{ type: 'bar', data: data.map(item => item.value), }], }; chart.setOption(options); }); </script> </body> </html>
最后,我们打开终端,进入项目目录并运行go run main.go
启动我们的golang服务器。
在浏览器中访问http://localhost:8080
rrreee
Dalam langkah kedua, kami mencipta struktur data mudah untuk mewakili statistik kami:rrreee
Dalam langkah ketiga, kami mencipta fungsi pengendali untuk mengendalikan Permintaan HTTP, dan kembalikan data ke bahagian hadapan dalam format JSON: 🎜rrreee🎜Dalam langkah keempat, kami mencipta fungsi utama dan memulakan pelayan HTTP untuk mendengar permintaan: 🎜rrreee🎜Seterusnya, kami kembali ke hadapan- bahagian akhir ECharts. Buat fail bernamaindex.html
dalam direktori projek dan tambahkan kod berikut padanya: 🎜rrreee🎜Akhir sekali, kami membuka terminal, masukkan direktori projek dan jalankan go run main.go
Mulakan pelayan golang kami. 🎜🎜Lawati http://localhost:8080
dalam penyemak imbas anda, anda akan melihat halaman yang mengandungi carta statistik. Carta ini akan mempamerkan data kami, dibentangkan sebagai carta bar. 🎜🎜Melalui contoh mudah ini, kami belajar cara menggunakan ECharts dan golang untuk mencipta carta statistik yang cantik. Anda boleh mengubah suai data dan jenis carta mengikut keperluan anda sendiri, dan ECharts menyediakan banyak pilihan untuk memenuhi keperluan yang berbeza. 🎜🎜Saya harap artikel ini membantu anda, dan saya berharap anda pergi lebih jauh dan lebih jauh di jalan visualisasi data! 🎜Atas ialah kandungan terperinci Bermula dari awal: menggunakan ECharts dan golang untuk mencipta carta statistik yang cantik. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Alat AI Hot

Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool
Gambar buka pakaian secara percuma

Clothoff.io
Penyingkiran pakaian AI

AI Hentai Generator
Menjana ai hentai secara percuma.

Artikel Panas

Alat panas

Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6
Alat pembangunan web visual

SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas



Membaca dan menulis fail dengan selamat dalam Go adalah penting. Garis panduan termasuk: Menyemak kebenaran fail Menutup fail menggunakan tangguh Mengesahkan laluan fail Menggunakan tamat masa konteks Mengikuti garis panduan ini memastikan keselamatan data anda dan keteguhan aplikasi anda.

Bagaimana untuk mengkonfigurasi pengumpulan sambungan untuk sambungan pangkalan data Go? Gunakan jenis DB dalam pakej pangkalan data/sql untuk membuat sambungan pangkalan data untuk mengawal bilangan maksimum sambungan serentak;

Rangka kerja Go menyerlah kerana kelebihan prestasi tinggi dan konkurensinya, tetapi ia juga mempunyai beberapa kelemahan, seperti agak baharu, mempunyai ekosistem pembangun yang kecil dan kekurangan beberapa ciri. Selain itu, perubahan pantas dan keluk pembelajaran boleh berbeza dari rangka kerja ke rangka kerja. Rangka kerja Gin ialah pilihan popular untuk membina API RESTful kerana penghalaan yang cekap, sokongan JSON terbina dalam dan pengendalian ralat yang berkuasa.

Amalan terbaik: Cipta ralat tersuai menggunakan jenis ralat yang ditakrifkan dengan baik (pakej ralat) Sediakan lebih banyak butiran Log ralat dengan sewajarnya Sebarkan ralat dengan betul dan elakkan menyembunyikan atau menyekat ralat Balut seperti yang diperlukan untuk menambah konteks

Data JSON boleh disimpan ke dalam pangkalan data MySQL dengan menggunakan perpustakaan gjson atau fungsi json.Unmarshal. Pustaka gjson menyediakan kaedah kemudahan untuk menghuraikan medan JSON dan fungsi json.Unmarshal memerlukan penuding jenis sasaran kepada data JSON unmarshal. Kedua-dua kaedah memerlukan penyediaan pernyataan SQL dan melaksanakan operasi sisipan untuk mengekalkan data ke dalam pangkalan data.

Perbezaan antara rangka kerja GoLang dan rangka kerja Go ditunjukkan dalam seni bina dalaman dan ciri luaran. Rangka kerja GoLang adalah berdasarkan perpustakaan standard Go dan meluaskan fungsinya, manakala rangka kerja Go terdiri daripada perpustakaan bebas untuk mencapai tujuan tertentu. Rangka kerja GoLang lebih fleksibel dan rangka kerja Go lebih mudah digunakan. Rangka kerja GoLang mempunyai sedikit kelebihan dalam prestasi dan rangka kerja Go lebih berskala. Kes: gin-gonic (rangka Go) digunakan untuk membina REST API, manakala Echo (rangka kerja GoLang) digunakan untuk membina aplikasi web.

Cara menangani isu keselamatan biasa dalam rangka kerja Go Dengan penggunaan meluas rangka kerja Go dalam pembangunan web, memastikan keselamatannya adalah penting. Berikut ialah panduan praktikal untuk menyelesaikan masalah keselamatan biasa, dengan kod sampel: 1. SQL Injection Gunakan pernyataan yang disediakan atau pertanyaan berparameter untuk mengelakkan serangan suntikan SQL. Contohnya: constquery="SELECT*FROMusersWHEREusername=?"stmt,err:=db.Prepare(query)iferr!=nil{//Handleerror}err=stmt.QueryR

Masalah dan penyelesaian biasa dalam pengurusan pergantungan rangka kerja Go: Konflik pergantungan: Gunakan alatan pengurusan pergantungan, nyatakan julat versi yang diterima dan semak konflik pergantungan. Kunci masuk vendor: Diselesaikan dengan pertindihan kod, penguncian fail GoModulesV2 atau pembersihan direktori vendor secara tetap. Kerentanan keselamatan: Gunakan alat pengauditan keselamatan, pilih pembekal yang bereputasi, pantau buletin keselamatan dan pastikan kebergantungan dikemas kini.
