data_analysis/utils/chart-kit.js

// npm install echarts canvas

// const fs = require('fs');
const { createCanvas } = require('canvas');
const echarts = require('echarts');

module.exports = class ChartKit {

  // 例子：https://echarts.apache.org/examples/zh/editor.html?c=bar-negative
  static printBar(yData, xDataLeft, xDataRight) {
    // 创建一个 canvas 实例
    const width = 3840; // 宽度
    const height = 2160; // 高度
    const canvas = createCanvas(width, height);

    // 初始化 ECharts 实例
    const chart = echarts.init(canvas);

    let option = {
      tooltip: {
        trigger: 'axis',
        axisPointer: {
          type: 'shadow'
        }
      },
      legend: {
        data: ['Profit', 'Expenses', 'Income']
      },
      grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
      },
      xAxis: [
        {
          type: 'value'
        }
      ],
      yAxis: [
        {
          type: 'category',
          axisTick: {
            show: false
          },
          data: yData
        }
      ],
      series: [
        {
          name: 'Expenses',
          type: 'bar',
          stack: 'Total',
          label: {
            show: true,
            position: 'left'
          },
          emphasis: {
            focus: 'series'
          },
          data: xDataLeft
        },
        {
          name: 'Income',
          type: 'bar',
          stack: 'Total',
          label: {
            show: true
          },
          emphasis: {
            focus: 'series'
          },
          data: xDataRight
        }
      ]
    };

    // 设置图表的配置项和数据
    chart.setOption(option);

    // 等待图表渲染完毕
    // setTimeout(() => {
    //   const buffer = canvas.toBuffer('image/png');
    //   fs.writeFileSync('chart.png', buffer);
    //   chart.dispose(); // 释放图表实例，防止内存泄漏
    //   console.log('图表已保存为 chart.png');
    // }, 1000); // 设置一个延时以确保图表渲染完成

    return option
  }

  // dataList : [[x1,y1], [x2,y2], ...]
  static printPointChart(dataList) {
    // 创建一个 canvas 实例
    const width = 3840; // 宽度
    const height = 2160; // 高度
    const canvas = createCanvas(width, height);

    // 初始化 ECharts 实例
    const chart = echarts.init(canvas);

    // ECharts 配置项
    let option = {
      title: {
        text: '散点图'
      },
      xAxis: {},
      yAxis: {},
      series: [
        {
          symbolSize: 10,
          data: dataList,
          type: 'scatter'
        }
      ]
    };

    // 设置图表的配置项和数据
    chart.setOption(option);

    // 等待图表渲染完毕
    // setTimeout(() => {
    //   const buffer = canvas.toBuffer('image/png');
    //   fs.writeFileSync('chart.png', buffer);
    //   chart.dispose(); // 释放图表实例，防止内存泄漏
    //   console.log('图表已保存为 chart.png');
    // }, 1000); // 设置一个延时以确保图表渲染完成

    return option
  }
}