@semcore/chart
Version:
Semrush Chart Component
132 lines (131 loc) • 6.5 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _objectSpread4 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _recharts = require("recharts");
var _ReactUtils = require("recharts/lib/util/ReactUtils");
var _generateCategoricalChart = _interopRequireDefault(require("recharts/lib/chart/generateCategoricalChart"));
var _ChartUtils = require("recharts/lib/util/ChartUtils");
var _XAxis = _interopRequireDefault(require("recharts/lib/cartesian/XAxis"));
var _YAxis = _interopRequireDefault(require("recharts/lib/cartesian/YAxis"));
var _CartesianUtils = require("recharts/lib/util/CartesianUtils");
var axisComponents = [{
axisType: 'xAxis',
AxisComp: _XAxis["default"]
}, {
axisType: 'yAxis',
AxisComp: _YAxis["default"]
}];
var generateCategoricalChart = function generateCategoricalChart(params) {
var ReactComponent = (0, _generateCategoricalChart["default"])(params);
ReactComponent.prototype.getFormatItems = function (props, currentState) {
var _this = this;
var graphicalItems = currentState.graphicalItems,
stackGroups = currentState.stackGroups,
offset = currentState.offset,
updateId = currentState.updateId,
dataStartIndex = currentState.dataStartIndex,
dataEndIndex = currentState.dataEndIndex;
var barSize = props.barSize,
layout = props.layout,
barGap = props.barGap,
barCategoryGap = props.barCategoryGap,
globalMaxBarSize = props.maxBarSize;
var _this$constructor$get = this.constructor.getAxisNameByLayout(layout),
numericAxisName = _this$constructor$get.numericAxisName,
cateAxisName = _this$constructor$get.cateAxisName;
var hasBar = this.constructor.hasBar(graphicalItems);
var sizeList = hasBar && (0, _ChartUtils.getBarSizeList)({
barSize: barSize,
stackGroups: stackGroups
});
var formatedItems = [];
graphicalItems.forEach(function (item, index) {
var _stackGroups$numericA, _item$type;
var displayedData = _this.constructor.getDisplayedData(props, {
dataStartIndex: dataStartIndex,
dataEndIndex: dataEndIndex
}, item);
var _item$props = item.props,
dataKey = _item$props.dataKey,
childMaxBarSize = _item$props.maxBarSize;
var numericAxisId = item.props["".concat(numericAxisName, "Id")];
var cateAxisId = item.props["".concat(cateAxisName, "Id")];
var axisObj = axisComponents.reduce(function (result, entry) {
var _objectSpread2;
var axisMap = currentState["".concat(entry.axisType, "Map")];
var id = item.props["".concat(entry.axisType, "Id")];
var axis = axisMap === null || axisMap === void 0 ? void 0 : axisMap[id];
return (0, _objectSpread4["default"])((0, _objectSpread4["default"])({}, result), {}, (_objectSpread2 = {}, (0, _defineProperty2["default"])(_objectSpread2, entry.axisType, axis), (0, _defineProperty2["default"])(_objectSpread2, "".concat(entry.axisType, "Ticks"), (0, _ChartUtils.getTicksOfAxis)(axis)), _objectSpread2));
}, {});
var cateAxis = axisObj[cateAxisName];
var cateTicks = axisObj["".concat(cateAxisName, "Ticks")];
var stackedData = (stackGroups === null || stackGroups === void 0 ? void 0 : (_stackGroups$numericA = stackGroups[numericAxisId]) === null || _stackGroups$numericA === void 0 ? void 0 : _stackGroups$numericA.hasStack) && (0, _ChartUtils.getStackedDataOfItem)(item, stackGroups[numericAxisId].stackGroups);
var bandSize = (0, _ChartUtils.getBandSizeOfAxis)(cateAxis, cateTicks);
var maxBarSize = childMaxBarSize == null ? globalMaxBarSize : childMaxBarSize;
var barPosition = hasBar && (0, _ChartUtils.getBarPosition)({
barGap: barGap,
barCategoryGap: barCategoryGap,
bandSize: bandSize,
sizeList: sizeList[cateAxisId],
maxBarSize: maxBarSize
});
var componsedFn = item === null || item === void 0 ? void 0 : (_item$type = item.type) === null || _item$type === void 0 ? void 0 : _item$type.getComposedData;
barPosition = barPosition.map(function (bar) {
var position = bar.position;
var offsetBar = position.offset,
size = position.size;
return (0, _objectSpread4["default"])((0, _objectSpread4["default"])({}, bar), {}, {
position: {
offset: barGap,
size: size + offsetBar * 2 - 2 * barGap
}
});
});
if (componsedFn) {
var _objectSpread3;
formatedItems.push({
props: (0, _objectSpread4["default"])((0, _objectSpread4["default"])({}, componsedFn((0, _objectSpread4["default"])((0, _objectSpread4["default"])({}, axisObj), {}, {
displayedData: displayedData,
props: props,
dataKey: dataKey,
item: item,
bandSize: bandSize,
barPosition: barPosition,
offset: offset,
stackedData: stackedData,
layout: layout,
dataStartIndex: dataStartIndex,
dataEndIndex: dataEndIndex,
onItemMouseLeave: (0, _ChartUtils.combineEventHandlers)(_this.handleItemMouseLeave, null, item.props.onMouseLeave),
onItemMouseEnter: (0, _ChartUtils.combineEventHandlers)(_this.handleItemMouseEnter, null, item.props.onMouseEnter)
}))), {}, (_objectSpread3 = {
key: item.key || "item-".concat(index)
}, (0, _defineProperty2["default"])(_objectSpread3, numericAxisName, axisObj[numericAxisName]), (0, _defineProperty2["default"])(_objectSpread3, cateAxisName, axisObj[cateAxisName]), (0, _defineProperty2["default"])(_objectSpread3, "animationId", updateId), _objectSpread3)),
childIndex: (0, _ReactUtils.parseChildIndex)(item, props.children),
item: item
});
}
});
return formatedItems;
};
return ReactComponent;
};
var _default = generateCategoricalChart({
chartName: 'BarChart',
GraphicalChild: _recharts.Bar,
axisComponents: [{
axisType: 'xAxis',
AxisComp: _XAxis["default"]
}, {
axisType: 'yAxis',
AxisComp: _YAxis["default"]
}],
formatAxisMap: _CartesianUtils.formatAxisMap
});
exports["default"] = _default;
//# sourceMappingURL=HistogramChart.js.map