@linkdesign/screen/lib/g2-chart/index.js

屏组件库，但使用场景又不局限于屏。主要用于BI、大盘和屏

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports["default"] = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
var _react = _interopRequireWildcard(require("react"));
var _classnames = _interopRequireDefault(require("classnames"));
var _lodashEs = require("lodash-es");
var _g = require("@antv/g2");
var _title = _interopRequireDefault(require("../title"));
var _context = _interopRequireDefault(require("../context"));
var _Utils = require("../Utils");
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
/**
 * G2图表
 *
 * @class G2Chart
 * @extends {PureComponent<IProps>}
 */
var G2Chart = /*#__PURE__*/function (_PureComponent) {
  (0, _inheritsLoose2["default"])(G2Chart, _PureComponent);
  function G2Chart(props) {
    var _this;
    _this = _PureComponent.call(this, props) || this;
    _this.containerRef = void 0;
    _this.titleRef = void 0;
    _this.chartRef = void 0;
    _this.chart = void 0;
    _this.containerHeight = void 0;
    _this.containerRef = /*#__PURE__*/_react["default"].createRef();
    _this.titleRef = /*#__PURE__*/_react["default"].createRef();
    _this.chartRef = /*#__PURE__*/_react["default"].createRef();
    return _this;
  }
  var _proto = G2Chart.prototype;
  _proto.componentDidMount = function componentDidMount() {
    var _this$props = this.props,
      _this$props$config = _this$props.config,
      config = _this$props$config === void 0 ? {} : _this$props$config,
      options = _this$props.options,
      _this$props$onInit = _this$props.onInit,
      onInit = _this$props$onInit === void 0 ? function () {} : _this$props$onInit;
    this.containerHeight = this.containerRef.current.clientHeight;
    var height = this.titleRef.current ? this.containerHeight - (0, _Utils.Dimension)(this.titleRef.current) : this.containerHeight;
    this.chart = new _g.Chart((0, _extends2["default"])({
      container: this.chartRef.current,
      autoFit: true,
      height: height
    }, config, {
      options: options
    }));
    onInit(this.chart);
    this.chart.render();
  };
  _proto.componentDidUpdate = function componentDidUpdate(prevProps) {
    var options = this.props.options;
    if (!(0, _lodashEs.isEqual)(options, prevProps.options)) {
      this.chart.updateOptions(options);
    }
  };
  _proto.componentWillUnmount = function componentWillUnmount() {
    this.chart.destroy();
  };
  _proto.render = function render() {
    var _cssPrefix = this.context._cssPrefix;
    var _this$props2 = this.props,
      className = _this$props2.className,
      title = _this$props2.title,
      universalStyle = _this$props2.universalStyle,
      _this$props2$titleOpt = _this$props2.titleOptions,
      titleOptions = _this$props2$titleOpt === void 0 ? {
        align: 'left',
        textStyle: {
          marginBottom: 8
        }
      } : _this$props2$titleOpt;
    return /*#__PURE__*/_react["default"].createElement("div", {
      ref: this.containerRef,
      className: (0, _classnames["default"])(className, _cssPrefix + "chart-wrapper"),
      style: {
        width: (0, _lodashEs.get)(universalStyle, 'width'),
        height: (0, _lodashEs.get)(universalStyle, 'height')
      }
    }, title &&
    /*#__PURE__*/
    // @ts-ignore
    _react["default"].createElement(_title["default"], (0, _extends2["default"])({}, titleOptions, {
      forwardRef: this.titleRef,
      className: (0, _classnames["default"])(_cssPrefix + "chart-title", _cssPrefix + "main-chart-title", (0, _lodashEs.get)(titleOptions, 'className'))
    }), title), /*#__PURE__*/_react["default"].createElement("div", {
      ref: this.chartRef,
      className: _cssPrefix + "chart-content"
    }));
  };
  return G2Chart;
}(_react.PureComponent);
G2Chart.contextType = _context["default"];
var _default = exports["default"] = G2Chart;