Maison > développement back-end > Golang > Utilisez le framework Gin pour implémenter des fonctions de visualisation de données et de reporting

Utilisez le framework Gin pour implémenter des fonctions de visualisation de données et de reporting

WBOY
Libérer: 2023-06-22 20:49:44
original
1341 Les gens l'ont consulté

Dans le développement de logiciels modernes, les fonctions de visualisation et de reporting des données reçoivent de plus en plus d'attention, car elles peuvent aider les utilisateurs à mieux comprendre et analyser les données, et aider les entreprises à mieux gérer leur activité et prendre des décisions. Dans cet article, nous présenterons comment utiliser le framework Gin pour implémenter des fonctions de visualisation de données et de reporting afin d'aider les lecteurs à mieux apprendre et appliquer cette technologie.

Le framework Gin est un framework web léger basé sur le langage Go et présente les caractéristiques de hautes performances et de simplicité d'utilisation. Son concept de conception est de fournir un ensemble d'outils de base (routage, middleware, rendu) pour répondre aux besoins fondamentaux du développement Web, et peut être facilement étendu et personnalisé. Par conséquent, des applications Web efficaces, évolutives et faciles à maintenir peuvent être rapidement développées à l’aide du framework Gin.

Les fonctions de visualisation de données et de reporting présentées dans cet article sont basées sur l'API RESTful fournie par le framework Gin et le framework front-end fourni par Vue.js. Vue.js est un framework JavaScript populaire qui prend en charge le développement de composants basés sur les données, facilitant ainsi le développement d'applications frontales complexes. Dans le même temps, Vue.js fournit également une multitude de plug-ins et de composants pour implémenter des fonctions de visualisation de données et de reporting, tels que des plug-ins tels que ECharts et DataTables.

Tout d'abord, nous devons créer une application Web basée sur le framework Gin et définir des API RESTful pour gérer les demandes de données. Dans cet exemple, nous supposons que nous devons afficher certaines données de ventes, notamment les ventes, le volume des commandes, les catégories de produits, etc. Nous pouvons définir l'API suivante :

  • GET /api/sales : renvoie une liste de toutes les données de vente.
  • GET /api/sales/:id : renvoie des informations détaillées sur des données de vente spécifiques.
  • POST /api/sales : Créez de nouvelles données de vente.
  • PUT /api/sales/:id : Mettre à jour les informations d'une donnée de vente spécifique.
  • DELETE /api/sales/:id : Supprimez des données de vente spécifiques.

Il est très simple de définir l'API dans le framework Gin. Il vous suffit d'utiliser la méthode et le chemin HTTP correspondants, et de lier la fonction de traitement correspondante. Par exemple :

func main() {
    r := gin.Default()

    r.GET("/api/sales", getSales)
    r.GET("/api/sales/:id", getSale)
    r.POST("/api/sales", createSale)
    r.PUT("/api/sales/:id", updateSale)
    r.DELETE("/api/sales/:id", deleteSale)

    r.Run()
}

func getSales(c *gin.Context) {
    // TODO: 返回所有销售数据的列表。
}

func getSale(c *gin.Context) {
    id := c.Param("id")
    // TODO: 返回某个特定销售数据的详细信息。
}

func createSale(c *gin.Context) {
    // TODO: 创建一条新的销售数据。
}

func updateSale(c *gin.Context) {
    id := c.Param("id")
    // TODO: 更新某个特定销售数据的信息。
}

func deleteSale(c *gin.Context) {
    id := c.Param("id")
    // TODO: 删除某个特定销售数据。
}
Copier après la connexion

Ensuite, nous devons utiliser Vue.js pour créer l'application frontale et utiliser des plug-ins tels que ECharts et DataTables pour implémenter des fonctions de visualisation de données et de reporting. Tout d'abord, nous devons utiliser Vue.js pour créer une page simple, comprenant un tableau et des graphiques, pour afficher les données de ventes. Par exemple :

<template>
  <div>
    <div>
      <table id="sales-table"></table>
    </div>
    <div>
      <div id="sales-chart1"></div>
      <div id="sales-chart2"></div>
    </div>
  </div>
</template>

<script>
import $ from 'jquery'
import 'datatables.net-bs4'
import echarts from 'echarts'

export default {
  name: 'SalesPage',
  data () {
    return {
      sales: []
    }
  },
  mounted () {
    this.loadSales()
  },
  methods: {
    loadSales () {
      $.ajax({
        url: '/api/sales',
        type: 'GET',
        success: (data) => {
          this.sales = data
          this.renderTable()
          this.renderCharts()
        }
      })
    },
    renderTable () {
      $('#sales-table').DataTable({
        data: this.sales,
        columns: [
          { title: 'ID', data: 'id' },
          { title: 'Amount', data: 'amount' },
          { title: 'Quantity', data: 'quantity' },
          { title: 'Product', data: 'product' },
          { title: 'Category', data: 'category' }
        ]
      })
    },
    renderCharts () {
      const chart1 = echarts.init(document.getElementById('sales-chart1'))
      const chart2 = echarts.init(document.getElementById('sales-chart2'))

      // TODO: 渲染图表数据。
    }
  }
}
</script>
Copier après la connexion

Dans cette page, nous utilisons des DataTables pour afficher les données de ventes dans un tableau, et des ECharts pour afficher les données de ventes sous forme de graphiques. Nous avons appelé GET /api/sales une fois dans la méthode loadSales pour charger les données de ventes, et avons transmis les données de ventes aux méthodes renderTable et renderCharts pour utiliser DataTables et ECharts pour restituer les données. Dans la méthode renderTables, nous utilisons le plugin DataTable de jQuery pour restituer les tableaux, et dans la méthode renderCharts, nous utilisons ECharts pour restituer les graphiques.

Ensuite, nous devons implémenter les fonctions de traitement définies dans l'API RESTful pour gérer les demandes de données. Dans cet exemple, nous pouvons utiliser SQLite comme base de données et Gorm comme framework ORM pour faire fonctionner la base de données. Dans le même temps, nous devons également utiliser certains plug-ins pour nous aider dans le traitement et la vérification des données, tels que gommon/validation et d'autres plug-ins. Par exemple :

import (
  "github.com/gin-gonic/gin"
  "github.com/jinzhu/gorm"
  _ "github.com/mattn/go-sqlite3"
  "github.com/wbsnail/articles/GinDataVisualization/internal/sales"
  "gopkg.in/go-playground/validator.v9"
)

type SaleInput struct {
  Amount   float64 `json:"amount" validate:"required"`
  Quantity int     `json:"quantity" validate:"required"`
  Product  string  `json:"product" validate:"required"`
  Category string  `json:"category" validate:"required"`
}

func main() {
  db, err := gorm.Open("sqlite3", "sales.db")
  if err != nil {
    panic("failed to connect database")
  }
  defer db.Close()

  db.AutoMigrate(&sales.Sale{})

  r := gin.Default()

  r.GET("/api/sales", getSales)
  r.GET("/api/sales/:id", getSale)
  r.POST("/api/sales", createSale)
  r.PUT("/api/sales/:id", updateSale)
  r.DELETE("/api/sales/:id", deleteSale)

  r.Run()
}

func getSales(c *gin.Context) {
  db := c.MustGet("db").(*gorm.DB)
  var sales []sales.Sale
  db.Find(&sales)
  c.JSON(http.StatusOK, sales)
}

func getSale(c *gin.Context) {
  db := c.MustGet("db").(*gorm.DB)
  var sale sales.Sale
  if err := db.Where("id = ?", c.Param("id")).First(&sale).Error; err != nil {
    c.AbortWithStatus(http.StatusNotFound)
  } else {
    c.JSON(http.StatusOK, sale)
  }
}

func createSale(c *gin.Context) {
  db := c.MustGet("db").(*gorm.DB)
  var input SaleInput
  if err := c.ShouldBindJSON(&input); err != nil {
    c.AbortWithStatus(http.StatusBadRequest)
  } else if err := validate.Struct(input); err != nil {
    c.AbortWithStatus(http.StatusBadRequest)
  } else {
    sale := sales.Sale{Amount: input.Amount, Quantity: input.Quantity, Product: input.Product, Category: input.Category}
    db.Create(&sale)
    c.JSON(http.StatusOK, sale)
  }
}

func updateSale(c *gin.Context) {
  db := c.MustGet("db").(*gorm.DB)
  var input SaleInput
  if err := c.ShouldBindJSON(&input); err != nil {
    c.AbortWithStatus(http.StatusBadRequest)
  } else if err := validate.Struct(input); err != nil {
    c.AbortWithStatus(http.StatusBadRequest)
  } else {
    var sale sales.Sale
    if err := db.Where("id = ?", c.Param("id")).First(&sale).Error; err != nil {
      c.AbortWithStatus(http.StatusNotFound)
    } else {
      sale.Amount = input.Amount
      sale.Quantity = input.Quantity
      sale.Product = input.Product
      sale.Category = input.Category
      db.Save(&sale)
      c.JSON(http.StatusOK, sale)
    }
  }
}

func deleteSale(c *gin.Context) {
  db := c.MustGet("db").(*gorm.DB)
  var sale sales.Sale
  if err := db.Where("id = ?", c.Param("id")).First(&sale).Error; err != nil {
    c.AbortWithStatus(http.StatusNotFound)
  } else {
    db.Delete(&sale)
    c.Status(http.StatusOK)
  }
}
Copier après la connexion

Dans cet exemple, nous définissons une structure SaleInput pour représenter le format d'entrée des données de vente et utilisons validate pour vérifier la légalité des données d'entrée. Dans les méthodes createSale et updateSale, nous convertissons les données d'entrée en une structure Sale et utilisons db.Create et db.Save pour créer ou mettre à jour les données de vente. Dans les méthodes getSales, getSale et deleteSale, nous utilisons db.Find, db.Where et db.Delete pour interroger et supprimer les données de vente. Dans toutes les fonctions de traitement, nous utilisons db := c.MustGet("db").(*gorm.DB) pour obtenir l'objet de connexion à la base de données, car nous en avons déjà enregistré un lors de la création de l'application pour établir une base de données. connection et stockons l'objet de connexion dans c.Keys["db"], afin que nous puissions utiliser l'objet de connexion dans chaque fonction de traitement de requête.

Enfin, nous devons lier la page Web et l'API RESTful via le framework Gin, afin que les utilisateurs puissent accéder et exploiter les données en accédant à la page Web. Dans cet exemple, nous pouvons utiliser le middleware de rendu HTML (ou rendu JSON) fourni par le framework Gin pour lier la page Web et l'API RESTful. Par exemple :

func main() {
  db, err := gorm.Open("sqlite3", "sales.db")
  if err != nil {
    panic("failed to connect database")
  }
  defer db.Close()

  db.AutoMigrate(&sales.Sale{})

  r := gin.Default()

  r.Use(func(c *gin.Context) {
    c.Set("db", db)
    c.Next()
  })

  r.GET("/", func(c *gin.Context) {
    c.HTML(http.StatusOK, "index.html", nil)
  })

  r.GET("/api/sales", getSales)
  r.GET("/api/sales/:id", getSale)
  r.POST("/api/sales", createSale)
  r.PUT("/api/sales/:id", updateSale)
  r.DELETE("/api/sales/:id", deleteSale)

  r.Run()
}
Copier après la connexion

Dans cet exemple, nous avons enregistré un middleware pour stocker l'objet de connexion à la base de données dans c.Keys["db"], puis avons lié une requête GET/et utilisé le middleware de rendu HTML pour restituer la page d'index .html. De cette façon, nous pouvons accéder à la page Web en accédant à http://localhost:8080.

En résumé, l'utilisation du framework Gin pour mettre en œuvre des fonctions de visualisation de données et de reporting est une technologie très pratique et utile. Elle peut nous aider à mieux comprendre et analyser les données commerciales, à prendre de meilleures décisions et à améliorer l'efficacité de la gestion de l'entreprise. Grâce à l’étude et à la pratique de cet article, nous pouvons mieux maîtriser cette technologie et l’appliquer au développement réel.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal