@cgeui/utils 0.0.2 → 0.0.4

package/dist/esm/charts/PieChart/util.js

@@ -0,0 +1,434 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { transformWithConfig } from "../Chart/utils/complementData";
+import { accAdd } from "../utils/data";
+import { hex2Rgb } from "../utils/charts/hex2Rgb";
+import { cloneDeep } from 'lodash';
+export var getLegendData = function getLegendData(data, chartConfig) {
+  var legend = chartConfig.legend;
+  return data === null || data === void 0 ? void 0 : data.map(function (item) {
+    return {
+      name: item === null || item === void 0 ? void 0 : item.name,
+      icon: (legend === null || legend === void 0 ? void 0 : legend.icon) || 'circle'
+    };
+  });
+};
+var getTotal = function getTotal(data) {
+  var total = 0;
+  for (var i = 0; i < data.length; i++) {
+    total = accAdd(total, data[i].value);
+  }
+  return total;
+};
+var getColorByTheme = function getColorByTheme(theme) {
+  if (theme === 'default') {
+    return {
+      innerColorLightColor: '#9EA4AD',
+      innerColorDarkColor: '#CFD5DE',
+      noDataColor: '#E7EAEF',
+      borderColor: '#fff'
+    };
+  } else {
+    return {
+      innerColorLightColor: '#fff',
+      innerColorDarkColor: 'rgba(255,255,255,0.2)',
+      noDataColor: '#9EA4AD',
+      borderColor: '#0B1227'
+    };
+  }
+};
+var getNoData = function getNoData(theme) {
+  var _getColorByTheme;
+  var color = (_getColorByTheme = getColorByTheme(theme)) === null || _getColorByTheme === void 0 ? void 0 : _getColorByTheme.noDataColor;
+  return {
+    outterCircleData: [{
+      name: '',
+      value: 0,
+      itemStyle: {
+        color: color
+      }
+    }],
+    centerCircleData: [{
+      name: '',
+      value: 0,
+      itemStyle: {
+        color: color
+      }
+    }]
+  };
+};
+
+//最大余额法使饼图各项相加的占比为100%
+export var getPercentValue = function getPercentValue(valueList, idx, precision) {
+  var _valueList$idx;
+  // 判断是否为空
+  if (!((_valueList$idx = valueList[idx]) !== null && _valueList$idx !== void 0 && _valueList$idx.value)) {
+    return 0;
+  }
+  // 求和
+  var sum = valueList.reduce(function (acc, val) {
+    return acc + (isNaN(Number(val === null || val === void 0 ? void 0 : val.value)) ? 0 : Number(val === null || val === void 0 ? void 0 : val.value));
+  }, 0);
+  if (sum === 0) {
+    return 0;
+  }
+  // 10的2次幂是100，用于计算精度。
+  var digits = Math.pow(10, precision);
+  // 扩大比例100，
+  var votesPerQuota = valueList.map(function (val) {
+    return (isNaN(Number(val === null || val === void 0 ? void 0 : val.value)) ? 0 : Number(val === null || val === void 0 ? void 0 : val.value)) / sum * digits * 100;
+  });
+  // 总数，扩大比例意味的总数要扩大
+  var targetSeats = digits * 100;
+  // 再向下取值，组成数组
+  var seats = votesPerQuota.map(function (votes) {
+    return Math.floor(votes);
+  });
+  // 再新计算合计，用于判断与总数量是否相同，相同则占比会100%
+  var currentSum = seats.reduce(function (acc, val) {
+    return acc + val;
+  }, 0);
+  // 余数部分的数组：原先数组减去向下取值的数组，得到余数部分的数组
+  var remainder = votesPerQuota.map(function (votes, idx) {
+    return votes - seats[idx];
+  });
+  // 给最大最大的余额加1，凑个占比100%；
+  while (currentSum < targetSeats) {
+    //  找到下一个最大的余额，给其加1
+    var max = Number.NEGATIVE_INFINITY;
+    var maxId = null;
+    for (var i = 0, len = remainder.length; i < len; ++i) {
+      if (remainder[i] > max) {
+        max = remainder[i];
+        maxId = i;
+      }
+    }
+    // 对最大项余额加1
+    ++seats[maxId];
+    // 已经增加最大余数加1，则下次判断就可以不需要再判断这个余额数。
+    remainder[maxId] = 0;
+    // 总的也要加1，为了判断是否总数是否相同，跳出循环。
+    ++currentSum;
+  }
+  // 这时候的seats就会总数占比会100%
+  return seats[idx] / digits;
+};
+export var getBasicData = function getBasicData(color, data, percentToFixedNumber, theme) {
+  if (!data || data.length === 0) {
+    return getNoData(theme);
+  }
+  var colorRgba = [];
+  var colorCenterRgba = [];
+
+  //将色号换成rgb形式
+  for (var i = 0; i < data.length; i++) {
+    var index = i % color.length;
+    colorRgba.push(hex2Rgb(color[index], 1));
+    colorCenterRgba.push(hex2Rgb(color[index], 0.16));
+  }
+  var len = data.length;
+  var outterCircleDataConfig = [];
+  var centerCircleDataConfig = [];
+  for (var _i = 0; _i < len; _i++) {
+    var percent = 0;
+    percent = getPercentValue(data, _i, 2);
+    outterCircleDataConfig.push(_objectSpread(_objectSpread({}, data[_i]), {}, {
+      percent: percent,
+      itemStyle: {
+        color: colorRgba[_i]
+      }
+    }));
+    centerCircleDataConfig.push(_objectSpread(_objectSpread({}, data[_i]), {}, {
+      percent: percent,
+      itemStyle: {
+        color: colorCenterRgba[_i]
+      }
+    }));
+  }
+  return {
+    outterCircleData: outterCircleDataConfig,
+    centerCircleData: centerCircleDataConfig
+  };
+};
+var defaultSeriesConfig = {
+  type: 'pie',
+  label: {
+    show: false
+  },
+  labelLine: {
+    show: false
+  }
+};
+export var getFontSizeByNumber = function getFontSizeByNumber(fontSize, number) {
+  switch (number === null || number === void 0 ? void 0 : number.toString().length) {
+    case 4:
+      return fontSize * 0.9;
+    case 5:
+      return fontSize * 0.85;
+    case 6:
+      return fontSize * 0.75;
+    case 7:
+    case 8:
+    case 9:
+    case 10:
+    case 11:
+    case 12:
+      return fontSize * 0.6;
+    default:
+      return fontSize;
+  }
+};
+export function mergeDeep(target, source) {
+  for (var key in source) {
+    if (source[key] instanceof Object && key in target) {
+      Object.assign(source[key], mergeDeep(target[key], source[key]));
+    }
+  }
+  // 合并两个对象
+  return Object.assign(target || {}, source);
+}
+var chartLabelFormatter = function chartLabelFormatter(data, title, unit, theme, locales, totalToFixedNumber, transformUnit, isShowTotal, customTotal, centerStyle, totalFontSizeCoefficient) {
+  var color = theme === 'default' ? '#000' : '#fff';
+  var total = customTotal ? customTotal : getTotal(data);
+  if (totalToFixedNumber !== null && totalToFixedNumber !== void 0 && totalToFixedNumber.toString()) {
+    total = total.toFixed(totalToFixedNumber);
+  }
+  total += transformUnit ? transformUnit : '';
+  var defaultCenterStyle = {
+    titleStyle: {
+      fontSize: '0.75rem',
+      color: color,
+      padding: title ? [0, 0, 20, 0] : [0, 0, 0, 0]
+    },
+    totalStyle: {
+      fontSize: "".concat(getFontSizeByNumber(2.625 * totalFontSizeCoefficient, total) * 16, "px"),
+      fontWeight: '700',
+      color: color
+    },
+    unitStyle: {
+      fontSize: '0.75rem',
+      color: color,
+      padding: [0, 0, -11, 0]
+    },
+    noDataStyle: {
+      fontSize: '20',
+      padding: [0, 0, -11, 0]
+    }
+  };
+  return {
+    show: isShowTotal === undefined ? true : isShowTotal,
+    position: 'center',
+    color: color,
+    formatter: function formatter() {
+      if (!data || data.length === 0) {
+        var _locales$PieChart;
+        return "{noDataStyle|".concat(locales === null || locales === void 0 || (_locales$PieChart = locales.PieChart) === null || _locales$PieChart === void 0 ? void 0 : _locales$PieChart.noData, "\n}");
+      }
+      return "{titleStyle|".concat(title, "}\n{totalStyle|").concat(total, "}{titleStyle|  }{unitStyle|").concat(unit, "}");
+    },
+    rich: mergeDeep(defaultCenterStyle, centerStyle)
+  };
+};
+export var handleSeriesConfig = function handleSeriesConfig() {
+  var seriesConfig = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  var center = seriesConfig.center,
+    radius = seriesConfig.radius;
+  var resolvedSeriesConfig = {
+    outer: _objectSpread({}, seriesConfig),
+    center: _objectSpread({}, seriesConfig),
+    inner: _defineProperty(_defineProperty({}, center && 'center', center), "radius", ['50%', '51%'])
+  };
+  if (radius && radius.length >= 2) {
+    var xRadius = _toConsumableArray(radius[0].split('%'))[0];
+    var YRadius = _toConsumableArray(radius[1].split('%'))[0];
+    var x = Number(xRadius);
+    var y = Number(YRadius);
+    resolvedSeriesConfig.center.radius = [x - 15 + '%', y - 8 + '%'];
+    resolvedSeriesConfig.inner.radius = [x - 22 + '%', y - 29 + '%'];
+  }
+  return resolvedSeriesConfig;
+};
+export var getSeriesConfig = function getSeriesConfig(dataset, theme, data, title, unit) {
+  var seriesConfig = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : {};
+  var locales = arguments.length > 6 ? arguments[6] : undefined;
+  var transform = arguments.length > 7 ? arguments[7] : undefined;
+  var transformUnit = arguments.length > 8 ? arguments[8] : undefined;
+  var totalToFixedNumber = arguments.length > 9 ? arguments[9] : undefined;
+  var isShowTotal = arguments.length > 10 ? arguments[10] : undefined;
+  var customTotal = arguments.length > 11 ? arguments[11] : undefined;
+  var centerStyle = arguments.length > 12 ? arguments[12] : undefined;
+  var totalFontSizeCoefficient = arguments.length > 13 ? arguments[13] : undefined;
+  var colorByTheme = getColorByTheme(theme);
+  var innerColorLight = {
+    value: 0.7,
+    itemStyle: {
+      color: colorByTheme.innerColorLightColor
+    }
+  };
+  var innerColorDark = {
+    value: 6,
+    itemStyle: {
+      color: colorByTheme.innerColorDarkColor
+    }
+  };
+  var circleItemStyle = {
+    borderRadius: 0,
+    borderWidth: 3,
+    borderColor: getColorByTheme(theme).borderColor
+  };
+  var resolvedSeriesConfig = handleSeriesConfig(seriesConfig);
+  var seriesData = [_objectSpread(_objectSpread({
+    name: 'outer',
+    data: dataset.outterCircleData,
+    radius: ['72%', '80%'],
+    itemStyle: circleItemStyle
+  }, defaultSeriesConfig), {}, {
+    label: chartLabelFormatter(data, title, unit, theme, locales, totalToFixedNumber, transformUnit, isShowTotal, customTotal, centerStyle, totalFontSizeCoefficient)
+  }, resolvedSeriesConfig.outer), _objectSpread(_objectSpread({
+    name: 'center',
+    data: dataset.centerCircleData,
+    radius: ['57%', '72%'],
+    itemStyle: circleItemStyle,
+    silent: true
+  }, defaultSeriesConfig), resolvedSeriesConfig.center), _objectSpread(_objectSpread({
+    name: 'inner',
+    data: [innerColorLight, innerColorDark, innerColorLight, innerColorLight, innerColorDark, innerColorLight],
+    silent: true
+  }, defaultSeriesConfig), resolvedSeriesConfig.inner)];
+  if (transform) {
+    var _transformWithConfig;
+    var copyData = cloneDeep(seriesData);
+    var transformData = (_transformWithConfig = transformWithConfig(copyData.splice(0, 2), transform, 'pie')) === null || _transformWithConfig === void 0 ? void 0 : _transformWithConfig.dataset.concat(seriesData.splice(2));
+    transformData[0].label = chartLabelFormatter(transformData[0].data, title, unit, theme, locales, totalToFixedNumber, transformUnit, isShowTotal, customTotal, centerStyle, totalFontSizeCoefficient);
+    return transformData;
+  }
+  return seriesData;
+};
+export var defaultLegendConfig = {
+  right: 100,
+  top: 'middle',
+  itemWidth: 6,
+  itemHeight: 6,
+  itemStyle: {
+    opacity: 0.85,
+    borderWidth: 0,
+    borderColor: 'transparent'
+  },
+  textStyle: {
+    rich: {
+      nameStyle: {
+        fontWeight: '400',
+        fontSize: '12'
+      },
+      percentStyle: {
+        fontWeight: '600',
+        fontSize: '14'
+      },
+      periodBasisTextStyle: {
+        color: '#888'
+      },
+      periodBasisValueUpStyle: {
+        color: '#30C147'
+      },
+      periodBasisValueDownStyle: {
+        color: '#D74851'
+      },
+      periodBasisIconUpStyle: {
+        backgroundColor: {
+          image: 'data:image/svg+xml;base64,PHN2ZyB0PSIxNzIzODgxMjg2ODg2IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjQxODMiIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiI+PHBhdGggZD0iTTgwMCA3MTQuNjY2NjY2NjdsLTI4NC44NjM5OTk5OS0zODQtMjkxLjEzNjAwMDAxIDM4NHoiIHAtaWQ9IjQxODQiIGZpbGw9IiMzMGMxNDciPjwvcGF0aD48L3N2Zz4='
+        }
+      },
+      periodBasisIconDownStyle: {
+        backgroundColor: {
+          image: 'data:image/svg+xml;base64,PHN2ZyB0PSIxNzIzODgxNDE2OTQ2IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjQzNjciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiI+PHBhdGggZD0iTTIyNCAzMDkuMzMzMzMzMzNsMjg0Ljg2NCAzODQgMjkxLjEzNi0zODR6IiBwLWlkPSI0MzY4IiBmaWxsPSIjZDc0ODUxIj48L3BhdGg+PC9zdmc+'
+        }
+      },
+      periodBasisIconRedUpStyle: {
+        backgroundColor: {
+          image: ' data:image/svg+xml;charset=utf-8;base64,PHN2ZyB0PSIxNzI0Mzc0NjE5ODY4IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjQ1MzQiIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiI+PHBhdGggZD0iTTgwMCA2NzIuMDAwMDAwMDFsLTI4NC44NjM5OTk5OS0zODQtMjkxLjEzNjAwMDAxIDM4NHoiIHAtaWQ9IjQ1MzUiIGZpbGw9IiNkNzQ4NTEiPjwvcGF0aD48L3N2Zz4='
+        }
+      },
+      periodBasisIconGreenDownStyle: {
+        backgroundColor: {
+          image: 'data:image/svg+xml;charset=utf-8;base64,PHN2ZyB0PSIxNzI0Mzc0Nzc2OTUyIiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjEyNjkiIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiI+PHBhdGggZD0iTTIyNCAzMDkuMzMzMzMzMzNsMjg0Ljg2Mzk5OTk5IDM4NCAyOTEuMTM2MDAwMDEtMzg0eiIgcC1pZD0iMTI3MCIgZmlsbD0iIzMwYzE0NyI+PC9wYXRoPjwvc3ZnPg=='
+        }
+      },
+      periodBasisNullStyle: {}
+    }
+  },
+  icon: 'circle',
+  orient: 'vertical',
+  itemGap: 15
+};
+export var chartLegendFormatter = function chartLegendFormatter(name, ticket, callback, dataset, sourceData, legendFormatter, lang, chartConfig, isShowPeriodBasisCompare, isGreenUp) {
+  var _chartConfig$legend;
+  var data = dataset.outterCircleData;
+  var value = 0;
+  var p = 0;
+  var yearToYear = undefined;
+  var monthToMonth = undefined;
+  if (!name) {
+    return null;
+  }
+  for (var i = 0, l = data.length; i < l; i++) {
+    if (data[i].name === name) {
+      var _data$i, _data$i2;
+      value = data[i].value;
+      p = data[i].percent;
+      monthToMonth = (_data$i = data[i]) === null || _data$i === void 0 ? void 0 : _data$i.monthToMonth;
+      yearToYear = (_data$i2 = data[i]) === null || _data$i2 === void 0 ? void 0 : _data$i2.yearToYear;
+    }
+  }
+  if (typeof legendFormatter === 'function') {
+    return legendFormatter(name, p, value, monthToMonth, yearToYear);
+  }
+  if (typeof (chartConfig === null || chartConfig === void 0 || (_chartConfig$legend = chartConfig.legend) === null || _chartConfig$legend === void 0 ? void 0 : _chartConfig$legend.legendFormatter) === 'function') {
+    var _chartConfig$legend2;
+    return chartConfig === null || chartConfig === void 0 || (_chartConfig$legend2 = chartConfig.legend) === null || _chartConfig$legend2 === void 0 ? void 0 : _chartConfig$legend2.legendFormatter(name, p, value, monthToMonth, yearToYear);
+  }
+  var periodBasisValueStyle = function periodBasisValueStyle(periodBasis) {
+    if (periodBasis === null || periodBasis === undefined) {
+      return 'periodBasisNullStyle';
+    }
+    if (isGreenUp) {
+      return periodBasis >= 0 ? 'periodBasisValueUpStyle' : 'periodBasisValueDownStyle';
+    } else {
+      return periodBasis >= 0 ? 'periodBasisValueDownStyle' : 'periodBasisValueUpStyle';
+    }
+  };
+  var periodBasisIconStyle = function periodBasisIconStyle(periodBasis) {
+    if (periodBasis === null || periodBasis === undefined) {
+      return 'periodBasisNullStyle';
+    }
+    if (isGreenUp) {
+      return periodBasis >= 0 ? 'periodBasisIconUpStyle' : 'periodBasisIconDownStyle';
+    } else {
+      return periodBasis >= 0 ? 'periodBasisIconRedUpStyle' : 'periodBasisIconGreenDownStyle';
+    }
+  };
+  var periodBasisNumber = function periodBasisNumber(periodBasis) {
+    if (periodBasis === null || periodBasis === undefined) {
+      return '';
+    }
+    var resolvedBasis = periodBasis;
+    if (periodBasis < 0) resolvedBasis = -resolvedBasis;
+    return resolvedBasis.toFixed(1) + '%';
+  };
+  //环比 monthToMonth，同比 yearToYear
+  if (lang === 'zh-CN') {
+    if (isShowPeriodBasisCompare) {
+      return "{nameStyle|".concat(name, "\u6570  }{percentStyle|").concat(p, "} {percentStyle|%}\n{periodBasisTextStyle|").concat(monthToMonth !== null && monthToMonth !== undefined ? '环比' : '', "} {").concat(periodBasisValueStyle(monthToMonth), "|").concat(periodBasisNumber(monthToMonth), "}{").concat(periodBasisIconStyle(monthToMonth), "| }{periodBasisTextStyle|").concat(yearToYear !== null && yearToYear !== undefined ? '同比' : '', "} {").concat(periodBasisValueStyle(yearToYear), "|").concat(periodBasisNumber(yearToYear), "}{").concat(periodBasisIconStyle(yearToYear), "| }");
+    } else return "{nameStyle|".concat(name, "\u6570  }{percentStyle|").concat(p, "} {percentStyle|%}");
+  }
+  return "{nameStyle|Number of ".concat(name, "  }{percentStyle|").concat(p, "} {percentStyle|%}");
+};

package/dist/esm/charts/SuperChart/config/bar.js

@@ -0,0 +1,39 @@
+import { themeColor } from "../../chartTheme";
+export var legend = {
+  itemWidth: 8,
+  itemHeight: 8,
+  // textStyle: {
+  //   color: 'rgba(255, 255, 255, 0.85)',
+  // },
+  itemStyle: {
+    opacity: 0.85
+  },
+  icon: 'diamond',
+  right: 0
+};
+export var color = [themeColor.blue, themeColor.purple, themeColor.red, themeColor.orange];
+export var lineBarColor = [themeColor.blue, themeColor.green];
+export var barWidth = 24;
+export var barBackground = {
+  showBackground: true,
+  backgroundStyle: {
+    color: themeColor.grey,
+    opacity: 0.09
+  }
+};
+export var tooltip = {
+  trigger: 'axis',
+  axisPointer: {
+    type: 'shadow',
+    shadowStyle: {
+      color: 'rgba(12, 111, 242, 0.09)'
+      // width: 40,
+    }
+  },
+  backgroundColor: 'rgba(255, 255, 255, 0.12)',
+  borderColor: 'rgba(255, 255, 255, 0.12)',
+  textStyle: {
+    color: '#FFFFFF'
+  }
+};
+export var colorArr = ['#00B42A', '#F4A547', '#525FDD', '#FFCB47', '#34A5E5', '#E67754', '13BDCC', 'C85DB8', '#30C147', '9251DE'];