@antv/f2
Version:
Charts for mobile visualization.
47 lines (46 loc) • 1.59 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = LabelView;
var _fEngine = require("@antv/f-engine");
var _util = require("@antv/util");
var _coord = require("../../../util/coord");
var DEFAULT_LABEL_CFG = {
textBaseline: 'middle',
fill: '#808080'
};
function LabelView(props) {
var _a;
var record = props.record,
offsetX = props.offsetX,
offsetY = props.offsetY,
points = props.points,
label = props.label,
guide = props.guide;
var origin = record.origin,
color = record.color;
var labelAttrs, guideAttrs;
if ((0, _util.isFunction)(label)) {
var point = points.length === 4 // 如果是金字塔图，顶部只有 3 个点
? (0, _coord.getMiddlePoint)(points[1], points[2]) : (0, _coord.getMiddlePoint)(points[0], points[1]);
labelAttrs = (0, _util.mix)({
x: point.x + offsetX,
y: point.y + offsetY
}, DEFAULT_LABEL_CFG, label(origin, color));
}
if ((0, _util.isFunction)(guide)) {
var point = (0, _coord.getMiddlePoint)(points.length === 4 ? (0, _coord.getMiddlePoint)(points[0], points[1]) : points[0], (0, _coord.getMiddlePoint)(points[2], (_a = points[3]) !== null && _a !== void 0 ? _a : points[1]));
guideAttrs = (0, _util.mix)({
x: point.x,
y: point.y,
textBaseline: 'middle',
textAlign: 'center'
}, DEFAULT_LABEL_CFG, guide(origin, color));
}
return (0, _fEngine.jsx)("group", null, labelAttrs && (0, _fEngine.jsx)("text", {
attrs: labelAttrs
}), guideAttrs && (0, _fEngine.jsx)("text", {
attrs: guideAttrs
}));
}