swOperation/node_modules/@antv/gui/esm/ui/indicator/indicator.js

import { __assign, __extends, __read, __rest, __spreadArray } from "tslib";
import { ElementEvent } from '@antv/g';
import { GUI } from '../../core';
import { Group } from '../../shapes';
import { classNames, isHorizontal, parseSeriesAttr, renderExtDo, select, splitStyle, subStyleProps, } from '../../util';
import { DEFAULT_INDICATOR_STYLE_PROPS } from './constant';
var CLASS_NAMES = classNames({
    background: 'background',
    labelGroup: 'label-group',
    label: 'label',
}, 'indicator');
var Indicator = /** @class */ (function (_super) {
    __extends(Indicator, _super);
    function Indicator(options) {
        var _this = _super.call(this, options, DEFAULT_INDICATOR_STYLE_PROPS) || this;
        _this.point = [0, 0];
        _this.group = _this.appendChild(new Group({}));
        _this.isMutationObserved = true;
        return _this;
    }
    Indicator.prototype.renderBackground = function () {
        if (!this.label)
            return;
        var _a = this.attributes, position = _a.position, padding = _a.padding;
        var _b = __read(parseSeriesAttr(padding), 4), t = _b[0], r = _b[1], b = _b[2], l = _b[3];
        var _c = this.label.node().getLocalBounds(), min = _c.min, max = _c.max;
        var points = [
            [min[0] - l, min[1] - t],
            [max[0] + r, max[1] + b],
        ];
        var path = this.getPath(position, points);
        var style = subStyleProps(this.attributes, 'background');
        this.background = select(this.group)
            .maybeAppendByClassName(CLASS_NAMES.background, 'path')
            .styles(__assign(__assign({}, style), { path: path }));
        this.group.appendChild(this.label.node());
    };
    Indicator.prototype.renderLabel = function () {
        var _a = this.attributes, formatter = _a.formatter, labelText = _a.labelText;
        var style = subStyleProps(this.attributes, 'label');
        var _b = __read(splitStyle(style), 2), _c = _b[0], groupStyle = _b[1], rawText = _c.text, textStyle = __rest(_c, ["text"]);
        this.label = select(this.group).maybeAppendByClassName(CLASS_NAMES.labelGroup, 'g').styles(groupStyle);
        if (!labelText)
            return;
        var text = this.label
            .maybeAppendByClassName(CLASS_NAMES.label, function () { return renderExtDo(formatter(labelText)); })
            .style('text', formatter(labelText).toString());
        text.selectAll('text').styles(textStyle);
    };
    Indicator.prototype.adjustLayout = function () {
        var _a = __read(this.point, 2), dx = _a[0], dy = _a[1];
        this.group.attr('x', -dx).attr('y', -dy);
    };
    Indicator.prototype.getPath = function (position, points) {
        var _this = this;
        var _a = __read(points, 2), _b = __read(_a[0], 2), x0 = _b[0], y0 = _b[1], _c = __read(_a[1], 2), x1 = _c[0], y1 = _c[1];
        // calc 4 edges
        var edges = {
            top: [
                [x0, y0],
                [x1, y0],
            ],
            right: [
                [x1, y0],
                [x1, y1],
            ],
            bottom: [
                [x1, y1],
                [x0, y1],
            ],
            left: [
                [x0, y1],
                [x0, y0],
            ],
        };
        var positionRevert = { top: 'bottom', right: 'left', bottom: 'top', left: 'right' };
        var path = Object.entries(edges).map(function (_a) {
            var _b = __read(_a, 2), pos = _b[0], e = _b[1];
            if (pos === positionRevert[position])
                return _this.createCorner(e);
            return [
                __spreadArray(['M'], __read(e[0]), false),
                __spreadArray(['L'], __read(e[1]), false),
            ];
        });
        path.push([['Z']]);
        return path.flat().filter(function (d, i, a) {
            if (i === 0)
                return true;
            return d[0] !== 'M';
        });
    };
    Indicator.prototype.createCorner = function (edge, size) {
        if (size === void 0) { size = 10; }
        // intrinsic parameter
        var cornerScale = 0.8;
        var isH = isHorizontal.apply(void 0, __spreadArray([], __read(edge), false));
        var _a = __read(edge, 2), _b = __read(_a[0], 2), x0 = _b[0], y0 = _b[1], _c = __read(_a[1], 2), x1 = _c[0], y1 = _c[1];
        var _d = __read(isH ? [x1 - x0, [x0, x1]] : [y1 - y0, [y0, y1]], 2), len = _d[0], _e = __read(_d[1], 2), b0 = _e[0], b1 = _e[1];
        var hL = len / 2;
        var sign = len / Math.abs(len);
        var cL = size * sign;
        var hCL = cL / 2;
        var cS = ((cL * Math.sqrt(3)) / 2) * cornerScale;
        var _f = __read([b0, b0 + hL - hCL, b0 + hL, b0 + hL + hCL, b1], 5), a0 = _f[0], a1 = _f[1], a2 = _f[2], a3 = _f[3], a4 = _f[4];
        if (isH) {
            this.point = [a2, y0 - cS];
            return [
                ['M', a0, y0],
                ['L', a1, y0],
                ['L', a2, y0 - cS],
                ['L', a3, y0],
                ['L', a4, y0],
            ];
        }
        this.point = [x0 + cS, a2];
        return [
            ['M', x0, a0],
            ['L', x0, a1],
            ['L', x0 + cS, a2],
            ['L', x0, a3],
            ['L', x0, a4],
        ];
    };
    Indicator.prototype.bindEvents = function () {
        this.label.on(ElementEvent.BOUNDS_CHANGED, this.renderBackground);
    };
    Indicator.prototype.render = function () {
        this.renderLabel();
        this.renderBackground();
        this.adjustLayout();
    };
    return Indicator;
}(GUI));
export { Indicator };
//# sourceMappingURL=indicator.js.map