ze-react-component-library
Version:
ZeroETP React Component Library
188 lines (149 loc) • 7.11 kB
JavaScript
;
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _react = _interopRequireWildcard(require("react"));
var _zeroetpApiSdk = require("zeroetp-api-sdk");
var _treemap = _interopRequireDefault(require("./treemap.svg"));
var _util = require("../common/util");
var _Chart = _interopRequireDefault(require("../../../components/Chart"));
var _util2 = require("../../../util");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
var __assign = void 0 && (void 0).__assign || function () {
__assign = Object.assign || function (t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) {
if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
}
}
return t;
};
return __assign.apply(this, arguments);
};
var __rest = void 0 && (void 0).__rest || function (s, e) {
var t = {};
for (var p in s) {
if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
}
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
}
return t;
};
var getName = function getName(item, property) {
var _a, _b;
if (property.type === "object") {
var nameProp = (0, _zeroetpApiSdk.getNameProperty)(property.schema);
if (nameProp) {
return (_a = item === null || item === void 0 ? void 0 : item[property.name]) === null || _a === void 0 ? void 0 : _a[nameProp.name];
}
return (_b = item === null || item === void 0 ? void 0 : item[property.name]) === null || _b === void 0 ? void 0 : _b["_id"];
}
return item === null || item === void 0 ? void 0 : item[property.name];
}; // 将api获取的数据转换成treemap的数据
var getTreemapData = function getTreemapData(data) {
if (!data) return [];
var groupby = data.logicform.groupby,
result = data.result,
columnProperties = data.columnProperties; // 一层的情况
if (groupby.length === 1) {
return result.map(function (r) {
var name = getName(r, columnProperties[0]);
return __assign(__assign({}, r), {
name: name,
labelName: name,
value: r[columnProperties[groupby.length].name]
});
});
} // 2层的情况
if (groupby.length === 2) {
var retData_1 = [];
result.forEach(function (r) {
var firstLevelName = getName(r, columnProperties[0]);
var firstLevelItem;
if (!(firstLevelItem = retData_1.find(function (i) {
return i.name === firstLevelName;
}))) {
firstLevelItem = {
name: firstLevelName,
labelName: firstLevelName,
children: []
};
retData_1.push(firstLevelItem);
}
var childName = getName(r, columnProperties[1]);
firstLevelItem.children.push(__assign(__assign({}, r), {
name: childName,
labelName: [childName, firstLevelName].join("\n"),
value: r[columnProperties[groupby.length].name]
}));
}); // console.log("retData", retData);
return retData_1;
}
return [];
};
var TreemapChart = /*#__PURE__*/(0, _react.memo)(function (props) {
var result = props.result,
option = props.option,
rest = __rest(props, ["result", "option"]);
var chartOption = {
tooltip: {
trigger: "item"
},
series: [{
type: "treemap",
data: getTreemapData(result),
breadcrumb: {
show: false
},
roam: false,
label: {
lineHeight: 16,
rich: {},
formatter: function formatter(params) {
var _a, _b; // 如果是1层groupby，第一行显示name，剩下显示指标。
// 如果是2层groupby，第一行显示第二层groupbyItem的name，第二行显示第一层groupbyItem的name，剩下显示指标。
// 显示所有preds里面的指标（风格和tooltip一样，圆点可以不要）。
var data = params.data;
var indicators = (result === null || result === void 0 ? void 0 : result.columnProperties.slice((_b = (_a = result === null || result === void 0 ? void 0 : result.logicform) === null || _a === void 0 ? void 0 : _a.groupby) === null || _b === void 0 ? void 0 : _b.length).map(function (d) {
return "" + d.name + (d.unit ? "(" + d.unit + ")" : "") + " " + (0, _util2.formatWithProperty)(d, data[d.name]);
})) || [];
var arr = [data.labelName].concat(indicators);
return arr.join("\n");
}
}
}]
};
return /*#__PURE__*/_react.default.createElement(_Chart.default, __assign({}, rest, {
result: result,
userOption: option,
chartOption: chartOption
}));
});
var treemap = {
key: "treemap",
title: "矩形树图",
icon: _treemap.default,
tip: "搜索结果中至少一个属性列和一个数值列",
type: "basic",
component: function component(props) {
return /*#__PURE__*/_react.default.createElement(TreemapChart, __assign({}, props));
},
valid: function valid(result) {
var _a;
if (!result) return false;
var logicform = result.logicform;
var predsValid = (0, _util.isPredsValid)(logicform);
if (predsValid && ((_a = logicform.groupby) === null || _a === void 0 ? void 0 : _a.length) <= 2) {
return true;
}
return false;
}
};
var _default = treemap;
exports.default = _default;