utils-echart/dist/types/utils-echarts/assets/common.ts

Echart component

import { splitLineType, symbolShape } from "./enum";

/** 公共配置 */
export const com = {
  colorData: ["#FF9626", "#FBE94B", "#5AAAFB", "#27C346", "#F756A9"],
  backgroundColor: "transparent",
  splitLine_x_show: false,
  splitLine_x_color: "#FA255E",
  splitLine_x_width: 1,
  splitLine_x_type: splitLineType.dashed,
  splitLine_y_show: true,
  splitLine_y_color: "#87c4e1",
  splitLine_y_width: 1,
  splitLine_y_type: splitLineType.dashed,
  grid: {
    left: "10%",
    right: "10%",
    bottom: "10%",
    top: "15%",
  },
  fontColor: "#000000",
  label: { show: true },
  xAxis: ["Mon", "Tue", "Wen", "Thu", "Fri"],
  legend: {
    show: true,
    icon: "rect",
  },
  title: {
    text: "",
  },
  showSymbol: false,
  symbol: symbolShape.emptyCircle,
  symbolSize: 6,
};

/** 默认无名称单数据 */
export const defaultData = {
  Mon: 10,
  Tues: 6,
  Wen: 8,
  Thur: 3,
  Fri: 9,
};

/** 默认带名称单数据 */
export const defaultSingleDataWithName = [
  { value: 40, name: "one" },
  { value: 50, name: "two" },
  { value: 60, name: "three" },
  { value: 80, name: "four" },
  { value: 100, name: "five" },
];

/** 默认带名称多数据 */
export const defaultMultipleDataWithName = {
  xAxis: ["Mon", "Tue", "Wen", "Thu", "Fri"],
  data: [
    {
      value: [10, 6, 8, 3, 4],
      name: "one",
    },
    {
      value: [5, 9, 4, 5, 3],
      name: "two",
    },
  ],
};

/** 颜色库 */
export const colorLibrary = ["#f6636f", "#ecc9a4", "#e9659f", "#f9b873", "#ba92c4", "#85c4cc", "#303f51", "#a7adb5", "#6eb370", "#5ba2c8"];

/** 渐变颜色组 */
export const gradientColorLibrary = [
  ["#ff626e", "#ffbe71"],
  ["#eec9a3", "#ef629f"],
  ["#bb5571", "#f0c6b5"],
];