ECharts と golang 実践ガイド: 多様な統計グラフの作成に関するチュートリアル

ECharts と golang 実践ガイド: 特定のコード例が必要な、多様な統計グラフの作成に関するチュートリアル

データ視覚化分野のリーダーとして、ECharts は次のような用途に使用できます。多くのシナリオに代わるものはありません。 golang は強力なパフォーマンスを備えたプログラミング言語であるため、ビッグ データのシナリオでも一定の利点があります。この記事では、ECharts と golang を使用してさまざまな統計グラフを作成する方法と、具体的なコード例を紹介します。

1. 準備

始める前に、次の基本的なスキルを習得する必要があります:

• Golang の基本的な構文といくつかの基本的なライブラリの使用
• ECharts の基本的な使用法と構成
• HTML、CSS、JS などのフロントエンドの基本に精通している。

##データ ソースの選択

統計グラフを作成する前に、まず使用するデータ ソースを決定する必要があります。ここでは、MySQL データベースの読み取りを例に挙げ、サードパーティのライブラリ「database/sql」および「go-sql-driver/mysql」を使用して読み取りを実現します。サンプル コードは次のとおりです。

import (
    "database/sql"
    "fmt"
    _ "github.com/go-sql-driver/mysql"
)

func main() {
    // connect to database server
    db, err := sql.Open("mysql", "user:password@tcp(127.0.0.1:3306)/database_name")
    if err != nil {
        fmt.Println("Failed to connect to database: ", err)
        return
    }
    defer db.Close()

    // execute query
    rows, err := db.Query("SELECT * FROM table_name")
    if err != nil {
        fmt.Println("Failed to execute query: ", err)
        return
    }
    defer rows.Close()

    // process query result
    for rows.Next() {
        var field1 int
        var field2 string
        // read fields from row
        err = rows.Scan(&field1, &field2)
        if err != nil {
            fmt.Println("Failed to read row: ", err)
            continue
        }
        // do something with fields
        fmt.Println(field1, field2)
    }
}

統計グラフの生成

データを取得した後、ECharts を使用して統計グラフを生成できます。 ECharts は、棒グラフ、折れ線グラフ、円グラフなど、さまざまな種類のグラフを提供します。ここでは、ヒストグラムを例として、単純なヒストグラムを生成する方法を説明します。サンプル コードは次のとおりです。

import (
    "github.com/chenjiandongx/go-echarts/charts"
    "github.com/chenjiandongx/go-echarts/opts"
)

func main() {
    // create a bar chart
    bar := charts.NewBar()

    // set chart title and axes labels
    bar.SetGlobalOptions(
        charts.WithTitleOpts(opts.Title{
            Title: "Bar Chart Example",
        }),
        charts.WithXAxisOpts(opts.XAxis{
            Name: "X Axis",
        }),
        charts.WithYAxisOpts(opts.YAxis{
            Name: "Y Axis",
        }),
    )

    // add data series to chart
    bar.AddSeries("Series 1", []opts.BarData{
        {Name: "A", Value: 10},
        {Name: "B", Value: 20},
        {Name: "C", Value: 30},
        {Name: "D", Value: 40},
        {Name: "E", Value: 50},
    })

    // render chart to HTML page
    page := charts.NewPage()
    page.Add(bar)
    page.Render("bar.html")
}

この例では、サードパーティ ライブラリのゴーチャートを使用してヒストグラムを生成します。まず Bar オブジェクトを作成し、タイトルと軸のラベルを設定してから、データ系列を追加して、グラフを HTML ページにレンダリングします。

データの視覚化

最後に、生成された HTML ページをブラウザーで開き、ヒストグラムの効果を確認します。実際の開発では、複数のグラフを組み合わせて表示したり、異なるデータ ソースを使用して異なるグラフを生成したりする必要がある場合があります。ここでは、テンプレート エンジンを使用して、さまざまな HTML ページを動的に生成できます。サンプル コードは次のとおりです。

import (
    "database/sql"
    "fmt"
    _ "github.com/go-sql-driver/mysql"
    "github.com/gin-gonic/gin"
    "github.com/pkg/errors"
    "net/http"
)

func main() {
    r := gin.Default()
    r.LoadHTMLGlob("templates/*")

    // define route handler
    r.GET("/bar/:table/:x/:y", func(c *gin.Context) {
        table := c.Param("table")
        x := c.Param("x")
        y := c.Param("y")
        data, err := queryData(table, x, y)
        if err != nil {
            c.String(http.StatusInternalServerError, "Failed to query data: "+err.Error())
            return
        }
        bar := charts.NewBar()
        bar.SetGlobalOptions(
            charts.WithTitleOpts(opts.Title{
                Title: fmt.Sprintf("Bar Chart (%s vs %s)", x, y),
            }),
            charts.WithXAxisOpts(opts.XAxis{
                Name: x,
            }),
            charts.WithYAxisOpts(opts.YAxis{
                Name: y,
            }),
        )
        bar.AddSeries(table, data)
        c.HTML(http.StatusOK, "bar.html", gin.H{
            "graph": bar.JSChart(),
        })
    })

    // listen on port 8080
    r.Run(":8080")
}

// query data from MySQL database
func queryData(table, x, y string) ([]opts.BarData, error) {
    db, err := sql.Open("mysql", "user:password@tcp(127.0.0.1:3306)/database_name")
    if err != nil {
        return nil, errors.Wrap(err, "Failed to connect to database")
    }
    defer db.Close()
    rows, err := db.Query(fmt.Sprintf("SELECT %s, %s FROM %s", x, y, table))
    if err != nil {
        return nil, errors.Wrap(err, "Failed to execute query")
    }
    defer rows.Close()
    var result []opts.BarData
    for rows.Next() {
        var field1 string
        var field2 float64
        err = rows.Scan(&field1, &field2)
        if err != nil {
            return nil, errors.Wrap(err, "Failed to read row")
        }
        result = append(result, opts.BarData{Name: field1, Value: field2})
    }
    return result, nil
}

この例では、gin Web フレームワークを使用して HTTP ルーティングおよび処理関数を定義します。ルート「/bar/:table/:x/:y」が定義されており、さまざまなパラメータを渡してさまざまな HTML ページを動的に生成できます。処理関数では、まず MySQL データベースからデータが読み取られ、次に ECharts を使用してヒストグラムが生成され、最後にグラフが HTML テンプレートに埋め込まれてクライアント ブラウザに返されます。

概要

この記事の学習を通じて、ECharts と golang を使用してさまざまな統計グラフを生成する方法を学びました。棒グラフ、折れ線グラフ、円グラフなどの一般的なグラフの種類であっても、この方法で実行できます。さらに、テンプレート エンジンを使用してさまざまな HTML ページを動的に生成し、データ視覚化の柔軟性と適用性を向上させることもできます。もちろん、実際の開発ではさらに注意すべき詳細やテクニックがあり、さらなる練習と探求が必要です。

以上がECharts と golang 実践ガイド: 多様な統計グラフの作成に関するチュートリアルの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。