Cara menggunakan ECharts dan golang untuk mencipta carta statistik peringkat profesional

PHPz
Lepaskan: 2023-12-18 12:49:12
asal
759 orang telah melayarinya

Cara menggunakan ECharts dan golang untuk mencipta carta statistik peringkat profesional

Cara menggunakan ECharts dan golang untuk mencipta carta statistik peringkat profesional

Pengenalan:
Dalam bidang visualisasi data, carta statistik adalah alat yang sangat penting. Mereka boleh mempersembahkan data yang kompleks kepada pengguna dengan cara yang intuitif, membantu pengguna memahami dan menganalisis data dengan lebih baik. ECharts ialah perpustakaan visualisasi data yang sangat popular, dan golang ialah bahasa pengaturcaraan yang pantas dan cekap. Artikel ini akan memperkenalkan cara menggunakan ECharts dan golang untuk mencipta carta statistik peringkat profesional dan memberikan contoh kod khusus.

1. Pengenalan
ECharts ialah perpustakaan carta visual sumber terbuka yang dibangunkan oleh Baidu Ia menyediakan pelbagai jenis carta statistik biasa, seperti carta garis, carta bar, carta pai, dsb., dan menyokong pelbagai kaedah interaksi. seperti Seret, zum, suis, dsb. ECharts dilaksanakan melalui teknologi JavaScript dan HTML5 dan boleh dirujuk terus dalam halaman web. Golang ialah bahasa pengaturcaraan untuk membangunkan aplikasi web Kesederhanaan dan kecekapannya menjadikannya pilihan yang ideal untuk membuat aplikasi visualisasi data.

2. Pemasangan dan konfigurasi

  1. Pasang ECharts: Anda boleh memuat turun versi terkini ECharts terus dari tapak web rasmi ECharts, dan kemudian nyahzipnya ke direktori projek, atau pasang melalui npm.
  2. Pasang golang: Anda boleh memuat turun versi terkini golang dari laman web rasmi golang dan memasangnya mengikut dokumentasi rasmi.

3. Langkah asas untuk membuat carta statistik

  1. Memperkenalkan perpustakaan ECharts: Dalam fail HTML, fail JavaScript ECharts perlu dirujuk.
<script src="echarts.min.js"></script>
Salin selepas log masuk
  1. Buat bekas: Dalam fail HTML, cipta bekas untuk memaparkan carta.
<div id="chart"></div>
Salin selepas log masuk
  1. Mulakan carta: Dalam kod golang, gunakan API yang disediakan oleh ECharts untuk membuat contoh carta dan nyatakan bekas.
chart := echarts.NewInitializedChart("chart")
Salin selepas log masuk
  1. Tetapkan pilihan carta: Gunakan API yang disediakan oleh ECharts untuk menetapkan pelbagai pilihan untuk carta, seperti tajuk, paksi-X, paksi-Y, dsb.
chart.SetTitleText("柱状图示例").
    SetXAxisData([]string{"一月", "二月", "三月", "四月", "五月"}).
    SetYAxisName("销售额").
    SetYAxisType("value")
Salin selepas log masuk
  1. Tambah siri data: Gunakan API yang disediakan oleh ECharts untuk menambah siri data dan tetapkan data yang sepadan.
chart.AddSeries("销售额",
    []string{"120", "200", "150", "80", "100"}).
    SetSeriesType("bar")
Salin selepas log masuk
  1. Carta render: Gunakan API yang disediakan oleh ECharts untuk memaparkan carta ke dalam bekas yang ditentukan.
chart.Render("renderChart")
Salin selepas log masuk

4 Contoh kod khusus
Berikut ialah contoh kod khusus untuk membuat histogram menggunakan ECharts dan golang:

package main

import (
    "fmt"
    "github.com/gin-gonic/gin"
    "github.com/go-echarts/go-echarts/v2"
    "net/http"
)

func main() {
    router := gin.Default()
    router.GET("/chart", func(c *gin.Context) {
        bar := echarts.NewBar("柱状图")
        bar.AddXAxis([]string{"一月", "二月", "三月", "四月", "五月"}).
            AddYAxis("销售额", []int{120, 200, 150, 80, 100})

        option := bar.SetGlobalOptions(
            echarts.WithTitleOpts(echarts.TitleOpts{Title: "柱状图示例"}),
            echarts.WithYAxisOpts(echarts.YAxisOpts{Name: "销售额"}),
        )

        page := echarts.NewOptsPage("柱状图示例", option)
        page.AddCharts(bar)

        c.HTML(http.StatusOK, "chart.html", gin.H{
            "chart": template.HTML(page.ToHTML()),
        })
    })

    router.Run(":8080")
}
Salin selepas log masuk

Dalam contoh di atas, kami menggunakan rangka kerja gin untuk mencipta aplikasi web dan menghasilkannya melalui GET minta carta bar. Dalam fungsi panggil balik yang mengendalikan permintaan, kami mencipta contoh histogram, menetapkan tajuk carta, paksi X, paksi Y dan pilihan lain dan menambah data yang sepadan. Carta itu kemudiannya diberikan ke dalam format HTML dan HTML dikembalikan kepada pelanggan melalui rangka kerja gin.

Kesimpulan:
Artikel ini memperkenalkan cara menggunakan ECharts dan golang untuk mencipta carta statistik peringkat profesional, dan menyediakan contoh kod khusus. Dengan mempelajari dan menguasai pengetahuan ini, kami boleh mencipta carta statistik yang cantik dan berkuasa dengan mudah untuk mempersembahkan dan menganalisis data dengan lebih baik. Semoga artikel ini bermanfaat kepada anda.

Atas ialah kandungan terperinci Cara menggunakan ECharts dan golang untuk mencipta carta statistik peringkat profesional. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan