@alicloud/cloud-charts/lib/Wmulticircle/index.js


'use strict';

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports["default"] = exports.MultiCircle = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
var _Base2 = _interopRequireDefault(require("../common/Base"));
var _errorWrap = _interopRequireDefault(require("../common/errorWrap"));
var _index = _interopRequireDefault(require("../themes/index"));
var _legendFilter = _interopRequireDefault(require("../common/legendFilter"));
var _rectTooltip = _interopRequireDefault(require("../common/rectTooltip"));
var _rectLegend = _interopRequireDefault(require("../common/rectLegend"));
var _geomSize = _interopRequireDefault(require("../common/geomSize"));
var _geomStyle = _interopRequireDefault(require("../common/geomStyle"));
var _circleAnnoation = _interopRequireDefault(require("../common/circleAnnoation"));
var _updateChildrenPosition = _interopRequireDefault(require("../common/updateChildrenPosition"));
require("./index.css");
var MultiCircle = exports.MultiCircle = /*#__PURE__*/function (_Base) {
  (0, _inheritsLoose2["default"])(MultiCircle, _Base);
  function MultiCircle() {
    var _this;
    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }
    _this = _Base.call.apply(_Base, [this].concat(args)) || this;
    _this.chartName = 'G2MultiCircle';
    _this.legendField = 'x';
    return _this;
  }
  var _proto = MultiCircle.prototype;
  _proto.getDefaultConfig = function getDefaultConfig() {
    return {
      colors: _index["default"].category_12,
      legend: {
        position: 'bottom',
        align: 'center',
        nameFormatter: null,
        // 可以强制覆盖，手动设置label
        valueFormatter: null
      },
      tooltip: {
        titleFormatter: null,
        nameFormatter: null,
        valueFormatter: null
      },
      marginRatio: 0,
      size: null,
      // 与饼图保持一致
      innerRadius: 0.6,
      radius: 0.8
    };
  };
  _proto.init = function init(chart, config, data) {
    var _this2 = this;
    // 设置数据度量
    var defs = {
      type: {
        type: 'cat'
      },
      y: {
        nice: false,
        max: config.max
        // maxLimit: 0.5
      }
      // percent: {
      //   max: 1,
      //   min: 0
      // }
    };
    chart.scale(defs);
    chart.data(data);

    // 设置图例
    (0, _rectLegend["default"])(this, chart, config, {}, 'single', null, false, function (item, index) {
      var raw = _this2.rawData && _this2.rawData[0] || {};
      return (0, _extends2["default"])({}, raw, item);
    });
    (0, _legendFilter["default"])(this, chart);

    // tooltip
    (0, _rectTooltip["default"])(this, chart, config, {}, null, {
      showTitle: false,
      showCrosshairs: false,
      showMarkers: false
    });
    (0, _circleAnnoation["default"])(chart, config, this.size, 'G2MultiCircle');

    // 设置坐标系
    chart.coordinate('theta', {
      innerRadius: config.innerRadius || 0.8,
      radius: config.radius || 1
    });
    chart.interaction('element-active');
    drawBar(chart, config, config.colors);
    chart.on('afterpaint', function () {
      (0, _updateChildrenPosition["default"])(chart, _this2.chartDom);
    });
  };
  return MultiCircle;
}(_Base2["default"]);
var Wmulticircle = (0, _errorWrap["default"])(MultiCircle);
var _default = exports["default"] = Wmulticircle;
function drawBar(chart, config, colors) {
  var size = config.size,
    _config$minSize = config.minSize,
    minSize = _config$minSize === void 0 ? 4 : _config$minSize,
    _config$maxSize = config.maxSize,
    maxSize = _config$maxSize === void 0 ? 24 : _config$maxSize,
    columnWidthRatio = config.columnWidthRatio;
  var geomConfig = {
    minColumnWidth: minSize || null,
    maxColumnWidth: maxSize || null,
    columnWidthRatio: columnWidthRatio || null
  };

  // 多重圆环背景色
  geomConfig = (0, _extends2["default"])({
    background: {
      style: {
        fill: _index["default"]['widgets-circle-stroke-background'],
        fillOpacity: 1
      }
    }
  }, geomConfig);
  var geom = chart.interval(geomConfig).position(['x', 'y']);
  geom = geom.color('x', colors).style({
    lineCap: 'round'
  });
  (0, _geomSize["default"])(geom, size, null, 'y', 'x*y*type*extra');
  (0, _geomStyle["default"])(geom, config.geomStyle, {}, 'x*y*type*extra');
}