@antv/g2plot/esm/plots/funnel/geometry/shape/funnel-dynamic-rect.js

G2 Plot, a market of plots built with the Grammar of Graphics'

import { __assign } from "tslib";
import * as _ from '@antv/util';
import { Global, registerShape } from '@antv/g2';
import { setFillStyle } from '@antv/g2/lib/element/util/shape';
function lerp(a, b, factor) {
    return (1 - factor) * a + factor * b;
}
// 获取填充图形的图形属性
function _getFillAttrs(cfg) {
    var defaultAttrs = Global.theme.shape.interval.rect.default;
    var attrs = _.mix({}, defaultAttrs, cfg.style);
    setFillStyle(attrs, cfg);
    return attrs;
}
// 根据矩形关键点绘制 path
function _getRectPath(points, _a) {
    var reverse = _a.reverse, ratioUpper = _a.ratioUpper, ratioLower = _a.ratioLower;
    var path = [];
    var firstPoint = points[0];
    var originX = (points[1].x + points[2].x) / 2;
    var factorTop = 1.2;
    var factorBottom = 0.6;
    if (reverse) {
        var tmp = ratioLower;
        ratioLower = ratioUpper;
        ratioUpper = tmp;
    }
    var firstPointX = (firstPoint.x - originX) * lerp(factorBottom, factorTop, ratioLower) + originX;
    path.push(['M', firstPointX, firstPoint.y]);
    for (var i = 1, len = points.length; i < len; i++) {
        var pointX = points[i].x;
        switch (i) {
            case 1:
            case 2:
                pointX = (pointX - originX) * lerp(factorBottom, factorTop, ratioUpper) + originX;
                break;
            case 3:
                pointX = (pointX - originX) * lerp(factorBottom, factorTop, ratioLower) + originX;
                break;
        }
        path.push(['L', pointX, points[i].y]);
    }
    path.push(['L', firstPointX, firstPoint.y]); // 需要闭合
    path.push(['z']);
    return path;
}
registerShape('interval', 'funnel-dynamic-rect', {
    draw: function (cfg, container) {
        var attrs = _getFillAttrs(cfg);
        var path = _getRectPath(cfg.points, _.get(cfg, 'origin._origin.__custom__'));
        path = this.parsePath(path);
        return container.addShape('path', {
            attrs: __assign(__assign({}, attrs), { path: path }),
        });
    },
    getMarkerStyle: function (markerCfg) {
        var isInCircle = markerCfg.isInCircle;
        var markerStyle = {
            symbol: isInCircle ? 'circle' : 'square',
            radius: isInCircle ? 4.5 : 4,
        };
        setFillStyle(markerStyle, markerCfg);
        return markerStyle;
    },
});
//# sourceMappingURL=funnel-dynamic-rect.js.map