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


'use strict';

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports["default"] = exports.Histogram = void 0;
var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
var _view = require("@antv/data-set/lib/view");
require("@antv/data-set/lib/api/statistics");
require("@antv/data-set/lib/transform/bin/histogram");
var _Base2 = _interopRequireDefault(require("../common/Base"));
var _errorWrap = _interopRequireDefault(require("../common/errorWrap"));
var _index = _interopRequireDefault(require("../themes/index"));
var _common = require("../common/common");
var _rectXAxis = _interopRequireDefault(require("../common/rectXAxis"));
var _rectYAxis = _interopRequireDefault(require("../common/rectYAxis"));
var _rectLegend = _interopRequireDefault(require("../common/rectLegend"));
var _rectTooltip = _interopRequireDefault(require("../common/rectTooltip"));
var _guide = _interopRequireDefault(require("../common/guide"));
var _label = _interopRequireDefault(require("../common/label"));
var _legendFilter = _interopRequireDefault(require("../common/legendFilter"));
var _geomStyle = _interopRequireDefault(require("../common/geomStyle"));
var _index2 = require("../common/interaction/index");
// 3.x代码
var Histogram = exports.Histogram = /*#__PURE__*/function (_Base) {
  (0, _inheritsLoose2["default"])(Histogram, _Base);
  function Histogram() {
    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 = 'G2Histogram';
    return _this;
  }
  var _proto = Histogram.prototype;
  _proto.getDefaultConfig = function getDefaultConfig() {
    return {
      colors: _index["default"].category_12,
      xAxis: {
        // type: "cat",
        labelFormatter: null,
        // 可以强制覆盖，手动设置label
        categories: null,
        autoRotate: false
        // 坐标轴粒度
        // tickInterval: 1,
      },
      yAxis: {
        labelFormatter: null,
        // 可以强制覆盖，手动设置label
        max: null,
        min: null
      },
      legend: {
        align: "left",
        nameFormatter: null // 可以强制覆盖，手动设置label
      },
      tooltip: {
        titleFormatter: null,
        nameFormatter: null,
        valueFormatter: null
      },
      grid: false,
      label: false,
      // 分箱粒度
      bin: {
        // bins: 10, // 分箱个数
        binWidth: 1,
        // 分箱步长（会覆盖bins的配置）
        offset: 0
      },
      column: true,
      // 是否归一化
      normalize: false
    };
  };
  _proto.init = function init(chart, config, data) {
    var defs = {
      x: (0, _common.propertyAssign)(_common.propertyMap.axis, {
        range: [0, 1]
      }, config.xAxis),
      y: (0, _common.propertyAssign)(_common.propertyMap.axis, {
        type: 'linear',
        nice: true
        // tickCount: 5,
      }, config.yAxis),
      type: {
        type: 'cat'
      }
    };
    var dataView = computerData(config, data);
    chart.scale(defs);
    chart.data(dataView.rows);

    // 设置X轴
    (0, _rectXAxis["default"])(this, chart, config);

    // 设置单个Y轴
    (0, _rectYAxis["default"])(this, chart, config);

    // 设置图例
    (0, _rectLegend["default"])(this, chart, config, null, 'multiple', "type");
    (0, _legendFilter["default"])(this, chart);

    // tooltip
    (0, _rectTooltip["default"])(this, chart, config, {
      position: 'top',
      shared: true,
      showMarkers: false
    }, null, {
      position: 'top',
      shared: true,
      showMarkers: false
    });

    // 绘制辅助线，辅助背景区域
    (0, _guide["default"])(chart, config);

    // 设置坐标系：极坐标/直角坐标
    var chartCoord = config.polar ? chart.coordinate("polar", {
      innerRadius: config.innerRadius || 0
    }) : chart.coordinate();

    // 横向柱状图
    if (!config.column) {
      chartCoord.transpose();
    }
    (0, _index2.activeRegionWithTheme)(chart);
    drawHist(chart, config);
  };
  _proto.changeData = function changeData(chart, config, data) {
    var dataView = computerData(config, data);
    chart && chart.changeData(dataView.rows);
  };
  return Histogram;
}(_Base2["default"]);
function drawHist(chart, config, field) {
  if (field === void 0) {
    field = "type";
  }
  var colors = config.colors;
  var geom = chart.interval().position('x*y').color(field, colors).adjust('stack');
  (0, _geomStyle["default"])(geom, config.geomStyle);
  (0, _label["default"])({
    geom: geom,
    config: config
  });
}
function computerData(config, data) {
  var _config$bin = config.bin,
    bins = _config$bin.bins,
    binWidth = _config$bin.binWidth,
    offset = _config$bin.offset;
  var dv = new _view.View().source(data);
  dv.transform({
    type: 'bin.histogram',
    field: 'x',
    bins: bins,
    binWidth: binWidth,
    offset: offset,
    groupBy: ['type', 'visible'],
    as: ['x', 'y']
  });
  if (config.normalize) {
    var total = dv.rows.reduce(function (acc, cur) {
      return acc + cur.y;
    }, 0);
    dv.transform({
      type: 'map',
      callback: function callback(row) {
        row.y = row.y / total;
        return row;
      }
    });
  }
  return dv;
}
var Whistogram = (0, _errorWrap["default"])(Histogram);
var _default = exports["default"] = Whistogram;