如何在expressJS中使用chartjs呈现数据

npm install express chart.js

const express = require('express');
const router = express.Router();
const Chart = require('chart.js');

// 定义路由处理函数
router.get('/chart', (req, res) => {
  // 创建一个图表实例
  const chart = new Chart();

  // 设置图表的配置选项和数据
  const chartConfig = {
    type: 'bar',
    data: {
      labels: ['Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange'],
      datasets: [{
        label: '# of Votes',
        data: [12, 19, 3, 5, 2, 3],
        backgroundColor: [
          'rgba(255, 99, 132, 0.2)',
          'rgba(54, 162, 235, 0.2)',
          'rgba(255, 206, 86, 0.2)',
          'rgba(75, 192, 192, 0.2)',
          'rgba(153, 102, 255, 0.2)',
          'rgba(255, 159, 64, 0.2)'
        ],
        borderColor: [
          'rgba(255, 99, 132, 1)',
          'rgba(54, 162, 235, 1)',
          'rgba(255, 206, 86, 1)',
          'rgba(75, 192, 192, 1)',
          'rgba(153, 102, 255, 1)',
          'rgba(255, 159, 64, 1)'
        ],
        borderWidth: 1
      }]
    },
    options: {
      scales: {
        y: {
          beginAtZero: true
        }
      }
    }
  };

  // 使用chartjs生成图表
  const image = chart.renderToBufferSync(chartConfig);

  // 将图表作为响应发送给客户端
  res.set('Content-Type', 'image/png');
  res.send(image);
});

// 导出路由模块
module.exports = router;

const express = require('express');
const app = express();
const chartRouter = require('./routes/chart');

// 添加路由中间件
app.use('/', chartRouter);

// 启动应用程序
app.listen(3000, () => {
  console.log('App listening on port 3000!');
});