Tutorial ECharts dan golang: Petua praktikal untuk membuat pelbagai carta statistik

Tutorial ECharts dan golang: Petua praktikal untuk membuat pelbagai carta statistik, contoh kod khusus diperlukan

Pengenalan
Dalam bidang analisis dan visualisasi data, carta statistik adalah alat yang sangat penting. Mereka boleh mengubah data yang kompleks kepada bentuk intuitif, mudah difahami, membantu kami memahami dan menganalisis data dengan lebih baik. ECharts ialah perpustakaan carta JavaScript sumber terbuka yang berkuasa, dan golang ialah bahasa pengaturcaraan yang mudah digunakan dan cekap. Menggabungkan kedua-duanya, kita boleh mencipta pelbagai carta statistik dengan lebih cekap.

Artikel ini akan memperkenalkan cara menggunakan ECharts dan golang untuk mencipta pelbagai jenis carta statistik, dan memberikan contoh kod khusus.

Persediaan
Sebelum bermula, sila pastikan anda telah memasang ECharts dan golang. ECharts boleh dimuat turun dan digunakan dari laman web rasmi (https://echarts.apache.org/), manakala golang boleh dimuat turun dan dipasang dari laman web rasmi (https://golang.org/).

Petua Praktikal 1: Buat Carta Bar
Carta bar ialah jenis carta statistik yang biasa digunakan untuk membandingkan data antara kategori yang berbeza. Di bawah ialah contoh kod untuk membuat histogram menggunakan ECharts dan golang:

//引入必要的golang依赖包
package main
import (
    "fmt"
    "net/http"
)

//处理请求的函数
func handler(w http.ResponseWriter, r *http.Request) {
    //模拟数据
    data := [][2]interface{}{
        {"类别1", 100},
        {"类别2", 200},
        {"类别3", 300},
    }
    
    //生成图表配置项
    option := map[string]interface{}{
        "tooltip": map[string]interface{}{
            "trigger": "axis",
        },
        "xAxis": map[string]interface{}{
            "type": "category",
            "data": []string{"类别1", "类别2", "类别3"},
        },
        "yAxis": map[string]interface{}{
            "type": "value",
        },
        "series": []map[string]interface{}{
            {
                "type": "bar",
                "data": []int{100, 200, 300},
            },
        },
    }

    //生成图表html
    html := fmt.Sprintf(`<div id="chart" style="width:600px;height:400px;"></div>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts@5.2.1/dist/echarts.min.js"></script>
        <script type="text/javascript">
            var chart = echarts.init(document.getElementById('chart'));
            chart.setOption(%s);
        </script>`, option)
    
    //返回html
    fmt.Fprint(w, html)
}

func main() {
    //将处理函数指定为路由处理函数
    http.HandleFunc("/", handler)
    
    //监听端口
    http.ListenAndServe(":8080", nil)
}

Kod di atas menunjukkan cara membuat histogram mudah menggunakan ECharts dan golang. Mula-mula, kami mentakrifkan fungsi pengendali untuk mengendalikan permintaan, di mana kami mensimulasikan beberapa data dan menjana objek option, yang mengandungi pelbagai konfigurasi untuk menyediakan item carta. Kemudian, kami sambungkan objek option ke dalam kod html yang mengandungi ECharts, dan akhirnya mengembalikannya ke penyemak imbas. handler，其中我们模拟了一些数据，并生成了一个option对象，该对象包含了设置图表的各种配置项。然后，我们将option对象拼接到一个包含了ECharts的html代码中，最后返回给浏览器。

要运行以上代码，可以使用命令go run main.go，然后在浏览器中访问http://localhost:8080，即可看到生成的柱状图。

实用技巧二：制作饼图
饼图是用于展示不同类别占比的统计图表。下面是一个使用ECharts和golang制作饼图的示例代码：

//引入必要的golang依赖包
package main
import (
    "fmt"
    "net/http"
)

//处理请求的函数
func handler(w http.ResponseWriter, r *http.Request) {
    //模拟数据
    data := [][2]interface{}{
        {"类别1", 100},
        {"类别2", 200},
        {"类别3", 300},
    }
    
    //生成图表配置项
    option := map[string]interface{}{
        "tooltip": map[string]interface{}{
            "trigger": "item",
            "formatter": "{a} <br/>{b}: {c} ({d}%)",
        },
        "series": []map[string]interface{}{
            {
                "name": "占比",
                "type": "pie",
                "radius": "55%",
                "data": []map[string]interface{}{
                    {
                        "value": 100,
                        "name": "类别1",
                    },
                    {
                        "value": 200,
                        "name": "类别2",
                    },
                    {
                        "value": 300,
                        "name": "类别3",
                    },
                },
            },
        },
    }

    //生成图表html
    html := fmt.Sprintf(`<div id="chart" style="width:600px;height:400px;"></div>
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts@5.2.1/dist/echarts.min.js"></script>
        <script type="text/javascript">
            var chart = echarts.init(document.getElementById('chart'));
            chart.setOption(%s);
        </script>`, option)
    
    //返回html
    fmt.Fprint(w, html)
}

func main() {
    //将处理函数指定为路由处理函数
    http.HandleFunc("/", handler)
    
    //监听端口
    http.ListenAndServe(":8080", nil)
}

以上代码演示了如何使用ECharts和golang制作一个简单的饼图。和制作柱状图的代码类似，我们定义了一个处理请求的函数handler，模拟了一些数据，并生成了一个option对象。这里的series配置项包含了一个pie类型的系列，用于定义饼图的数据和样式。最后，我们将option对象拼接到一个包含了ECharts的html代码中，将其返回给浏览器。

要运行以上代码，可以使用命令go run main.go，然后在浏览器中访问http://localhost:8080

Untuk menjalankan kod di atas, anda boleh menggunakan arahan go run main.go, dan kemudian lawati http://localhost:8080 dalam penyemak imbas untuk melihat yang dihasilkan Carta bar.

Petua Praktikal 2: Buat Carta Pai

Carta pai ialah carta statistik yang digunakan untuk menunjukkan perkadaran kategori yang berbeza. Berikut ialah contoh kod untuk membuat carta pai menggunakan ECharts dan golang:

rrreee

Kod di atas menunjukkan cara membuat carta pai mudah menggunakan ECharts dan golang. Sama seperti kod untuk membuat histogram, kami mentakrifkan fungsi pengendali yang mengendalikan permintaan, mensimulasikan beberapa data dan menjana objek option. Item konfigurasi siri di sini mengandungi siri jenis pie, yang digunakan untuk menentukan data dan gaya carta pai. Akhir sekali, kami menyambung objek option ke dalam kod html yang mengandungi ECharts dan mengembalikannya ke penyemak imbas. 🎜🎜Untuk menjalankan kod di atas, anda boleh menggunakan arahan go run main.go, dan kemudian lawati http://localhost:8080 dalam penyemak imbas untuk melihat yang dihasilkan Carta pai. 🎜🎜Kesimpulan🎜Artikel ini memperkenalkan cara menggunakan ECharts dan golang untuk membuat pelbagai jenis carta statistik, dan menyediakan contoh kod khusus. Dengan petua praktikal ini, kami boleh melakukan analisis data dan kerja visualisasi dengan lebih cekap. Sudah tentu, ECharts dan golang mempunyai lebih banyak fungsi dan kegunaan, yang boleh anda pelajari dan terokai dengan lebih lanjut. 🎜🎜Saya harap artikel ini akan membantu anda dalam menggunakan ECharts dan golang untuk mencipta carta statistik! 🎜

Atas ialah kandungan terperinci Tutorial ECharts dan golang: Petua praktikal untuk membuat pelbagai carta statistik. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!