swOperation/node_modules/@antv/gui/lib/ui/grid/index.js

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.Grid = void 0;
var tslib_1 = require("tslib");
var animation_1 = require("../../animation");
var core_1 = require("../../core");
var util_1 = require("../../util");
var CLASS_NAMES = (0, util_1.classNames)({
    lineGroup: 'line-group',
    line: 'line',
    regionGroup: 'region-group',
    region: 'region',
}, 'grid');
function getStraightPath(points) {
    return points.reduce(function (acc, curr, idx) {
        acc.push(tslib_1.__spreadArray([idx === 0 ? 'M' : 'L'], tslib_1.__read(curr), false));
        return acc;
    }, []);
}
function getSurroundPath(points, attr, reversed) {
    var _a = attr.connect, connect = _a === void 0 ? 'line' : _a, center = attr.center;
    if (connect === 'line')
        return getStraightPath(points);
    if (!center)
        return [];
    var radius = (0, util_1.distance)(points[0], center);
    var sweepFlag = reversed ? 0 : 1;
    return points.reduce(function (r, p, idx) {
        if (idx === 0)
            r.push(tslib_1.__spreadArray(['M'], tslib_1.__read(p), false));
        else
            r.push(tslib_1.__spreadArray(['A', radius, radius, 0, 0, sweepFlag], tslib_1.__read(p), false));
        return r;
    }, []);
}
function getLinePath(points, cfg, reversed) {
    if (cfg.type === 'surround')
        return getSurroundPath(points, cfg, reversed);
    return getStraightPath(points);
}
function connectPaths(from, to, cfg) {
    var type = cfg.type, connect = cfg.connect, center = cfg.center, closed = cfg.closed;
    var closeFlag = closed ? [['Z']] : [];
    var _a = tslib_1.__read([getLinePath(from, cfg), getLinePath(to.slice().reverse(), cfg, true)], 2), path1 = _a[0], path2 = _a[1];
    var _b = tslib_1.__read([from[0], to.slice(-1)[0]], 2), startOfFrom = _b[0], endOfTo = _b[1];
    var createPath = function (insertA, insertB) {
        return [path1, insertA, path2, insertB, closeFlag].flat();
    };
    if (connect === 'line' || type === 'surround') {
        return createPath([tslib_1.__spreadArray(['L'], tslib_1.__read(endOfTo), false)], [tslib_1.__spreadArray(['L'], tslib_1.__read(startOfFrom), false)]);
    }
    if (!center)
        throw new Error('Arc grid need to specified center');
    var _c = tslib_1.__read([(0, util_1.distance)(endOfTo, center), (0, util_1.distance)(startOfFrom, center)], 2), raduis1 = _c[0], radius2 = _c[1];
    return createPath([
        tslib_1.__spreadArray(['A', raduis1, raduis1, 0, 0, 1], tslib_1.__read(endOfTo), false),
        tslib_1.__spreadArray(['L'], tslib_1.__read(endOfTo), false),
    ], [
        tslib_1.__spreadArray(['A', radius2, radius2, 0, 0, 0], tslib_1.__read(startOfFrom), false),
        tslib_1.__spreadArray(['L'], tslib_1.__read(startOfFrom), false),
    ]);
}
function renderGridLine(container, data, attr, style) {
    var animate = attr.animate;
    var lines = data.map(function (item, idx) { return ({
        id: item.id || "grid-line-".concat(idx),
        path: getLinePath(item.points, attr),
    }); });
    return container
        .selectAll(CLASS_NAMES.line.class)
        .data(lines, function (d) { return d.id; })
        .join(function (enter) {
        return enter.append('path').each(function (datum, index) {
            var lineStyle = (0, util_1.getCallbackValue)((0, util_1.getPrimitiveAttributes)(tslib_1.__assign({ path: datum.path }, style)), [
                datum,
                index,
                lines,
            ]);
            this.attr(tslib_1.__assign({ class: CLASS_NAMES.line.name, stroke: '#D9D9D9', lineWidth: 1, lineDash: [4, 4] }, lineStyle));
        });
    }, function (update) {
        return update.transition(function (datum, index) {
            var lineStyle = (0, util_1.getCallbackValue)((0, util_1.getPrimitiveAttributes)(tslib_1.__assign({ path: datum.path }, style)), [
                datum,
                index,
                lines,
            ]);
            return (0, animation_1.transition)(this, lineStyle, animate.update);
        });
    }, function (exit) {
        return exit.transition(function () {
            var _this = this;
            var animation = (0, animation_1.fadeOut)(this, animate.exit);
            (0, animation_1.onAnimateFinished)(animation, function () { return _this.remove(); });
            return animation;
        });
    })
        .transitions();
}
function renderAlternateRegion(container, data, style) {
    var animate = style.animate, connect = style.connect, areaFill = style.areaFill;
    if (data.length < 2 || !areaFill || !connect)
        return [];
    var colors = Array.isArray(areaFill) ? areaFill : [areaFill, 'transparent'];
    var getColor = function (idx) { return colors[idx % colors.length]; };
    var regions = [];
    for (var idx = 0; idx < data.length - 1; idx++) {
        var _a = tslib_1.__read([data[idx].points, data[idx + 1].points], 2), prev = _a[0], curr = _a[1];
        var path = connectPaths(prev, curr, style);
        regions.push({ path: path, fill: getColor(idx) });
    }
    return container
        .selectAll(CLASS_NAMES.region.class)
        .data(regions, function (_, i) { return i; })
        .join(function (enter) {
        return enter
            .append('path')
            .each(function (datum, index) {
            var regionStyle = (0, util_1.getCallbackValue)(datum, [datum, index, regions]);
            this.attr(regionStyle);
        })
            .attr('className', CLASS_NAMES.region.name);
    }, function (update) {
        return update.transition(function (datum, index) {
            var regionStyle = (0, util_1.getCallbackValue)(datum, [datum, index, regions]);
            return (0, animation_1.transition)(this, regionStyle, animate.update);
        });
    }, function (exit) {
        return exit.transition(function () {
            var _this = this;
            var animation = (0, animation_1.fadeOut)(this, animate.exit);
            (0, animation_1.onAnimateFinished)(animation, function () { return _this.remove(); });
            return animation;
        });
    })
        .transitions();
}
function getData(attr) {
    var _a = attr.data, data = _a === void 0 ? [] : _a, closed = attr.closed;
    if (!closed)
        return data;
    return data.map(function (datum) {
        var points = datum.points;
        var _a = tslib_1.__read(points, 1), start = _a[0];
        return tslib_1.__assign(tslib_1.__assign({}, datum), { points: tslib_1.__spreadArray(tslib_1.__spreadArray([], tslib_1.__read(points), false), [start], false) });
    });
}
var Grid = /** @class */ (function (_super) {
    tslib_1.__extends(Grid, _super);
    function Grid() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    Grid.prototype.render = function (attributes, container) {
        // @ts-ignore do no passBy className
        var type = attributes.type, center = attributes.center, areaFill = attributes.areaFill, closed = attributes.closed, style = tslib_1.__rest(attributes, ["type", "center", "areaFill", "closed"]);
        var data = getData(attributes);
        var lineGroup = (0, util_1.select)(container).maybeAppendByClassName(CLASS_NAMES.lineGroup, 'g');
        var regionGroup = (0, util_1.select)(container).maybeAppendByClassName(CLASS_NAMES.regionGroup, 'g');
        var lineTransitions = renderGridLine(lineGroup, data, attributes, style);
        var reigionTransitions = renderAlternateRegion(regionGroup, data, attributes);
        return tslib_1.__spreadArray(tslib_1.__spreadArray([], tslib_1.__read(lineTransitions), false), tslib_1.__read(reigionTransitions), false);
    };
    return Grid;
}(core_1.GUI));
exports.Grid = Grid;
//# sourceMappingURL=index.js.map