Home  >  Article  >  Backend Development  >  How to use ECharts and golang to create professional-level statistical charts

How to use ECharts and golang to create professional-level statistical charts

PHPz
PHPzOriginal
2023-12-18 12:49:12729browse

How to use ECharts and golang to create professional-level statistical charts

How to use ECharts and golang to create professional-level statistical charts

Introduction:
In the field of data visualization, statistical charts are a very important tool. They can present complex data to users in an intuitive way, helping users better understand and analyze the data. ECharts is a very popular data visualization library, and golang is a fast and efficient programming language. This article will introduce how to use ECharts and golang to create professional-level statistical charts, and provide specific code examples.

1. Introduction
ECharts is an open source visual chart library developed by Baidu. It provides a variety of common statistical chart types, such as line charts, bar charts, pie charts, etc., and supports Multiple interaction methods, such as dragging, zooming, switching, etc. ECharts is implemented through JavaScript and HTML5 technology and can be directly referenced in web pages. Golang is a programming language for developing web applications. Its simplicity and efficiency make it an ideal choice for making data visualization applications.

2. Installation and configuration

  1. Install ECharts: You can download the latest version of ECharts directly from the ECharts official website, and then unzip it to the project directory, or install it through npm.
  2. Install golang: You can download the latest version of golang from the golang official website and install it according to the official documentation.

3. Basic steps for making statistical charts

  1. Introduce the ECharts library: In the HTML file, you need to reference the JavaScript file of ECharts.
<script src="echarts.min.js"></script>
  1. Create container: In the HTML file, create a container for displaying the chart.
<div id="chart"></div>
  1. Initialize the chart: In the golang code, use the API provided by ECharts to create a chart instance and specify the container.
chart := echarts.NewInitializedChart("chart")
  1. Set chart options: Use the API provided by ECharts to set various options for the chart, such as title, X-axis, Y-axis, etc.
chart.SetTitleText("柱状图示例").
    SetXAxisData([]string{"一月", "二月", "三月", "四月", "五月"}).
    SetYAxisName("销售额").
    SetYAxisType("value")
  1. Add data series: Use the API provided by ECharts to add a data series and set the corresponding data.
chart.AddSeries("销售额",
    []string{"120", "200", "150", "80", "100"}).
    SetSeriesType("bar")
  1. Render chart: Use the API provided by ECharts to render the chart into the specified container.
chart.Render("renderChart")

4. Specific code examples
The following is a specific code example using ECharts and golang to make a histogram:

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")
}

In the above example, we use gin Framework to create web applications and generate histograms through GET requests. In the callback function that handles the request, we create a histogram instance, set the chart's title, X-axis, Y-axis and other options, and add the corresponding data. The chart is then rendered into HTML format and the HTML is returned to the client through the gin framework.

Conclusion:
This article introduces how to use ECharts and golang to create professional-level statistical charts, and provides specific code examples. By learning and mastering this knowledge, we can easily create beautiful and powerful statistical charts to better present and analyze data. Hope this article is helpful to you.

The above is the detailed content of How to use ECharts and golang to create professional-level statistical charts. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn