@alicloud/cloud-charts
Version:

209 lines (163 loc) • 5.56 kB
JavaScript
;
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 _interaction = require("../common/interaction");
var 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, false, "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, _interaction.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"]);
exports.Histogram = Histogram;
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 = Whistogram;
exports["default"] = _default;