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

//引入必要的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)
}

//引入必要的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)
}