performance-test/src/assets/js/constants/echarts-config/stackedBar.js

/*
 * @Author: your name
 * @Date: 2024-11-19 16:25:10
 * @LastEditTime: 2024-11-25 09:46:37
 * @LastEditors: bogon
 * @Description: In User Settings Edit
 * @FilePath: /performance-test/src/assets/js/constants/echarts-config/stackedBar.js
 */
// 风机状态堆叠柱状图
// 用途：显示风机在不同状态（运行、停机、故障）下的时间分布。
// 适用场景：风机运行监控。
// 实现建议：
// 使用堆叠柱状图。
import { colorPalette } from "../color";
export const option = {
  color: colorPalette,
  title: {
    text: "风机状态",
  },
  xAxis: {
    type: "category",
    data: ["风机1", "风机2", "风机3", "风机4"], // 风机编号
  },
  legend: {
    top: "bottom",
  },
  toolbox: {
    feature: {
      dataView: { show: true, readOnly: false },
      magicType: { show: true, type: ["line", "bar"] },
      restore: { show: true },
      saveAsImage: { show: true },
    },
  },
  yAxis: {
    name: "时间 (小时)",
    type: "value",
  },
  series: [
    {
      name: "运行",
      type: "bar",
      stack: "总量",
      data: [10, 15, 20, 25],
    },
    {
      name: "停机",
      type: "bar",
      stack: "总量",
      data: [5, 5, 4, 6],
    },
    {
      name: "故障",
      type: "bar",
      stack: "总量",
      data: [1, 0, 2, 3],
    },
  ],
  tooltip: {
    trigger: "axis",
  },
};