@antv/g2plot/lib/plots/funnel/component/label/funnel-label.js

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

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var _ = tslib_1.__importStar(require("@antv/util"));
var g2_1 = require("@antv/g2");
var color_1 = require("../../../../util/color");
function avg(arr) {
    var sum = 0;
    _.each(arr, function (value) {
        sum += value;
    });
    return sum / arr.length;
}
function lerp(a, b, factor) {
    return (1 - factor) * a + factor * b;
}
var FunnelLabel = /** @class */ (function (_super) {
    tslib_1.__extends(FunnelLabel, _super);
    function FunnelLabel() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    FunnelLabel.prototype.setLabelPosition = function (point, originPoint, index) {
        var coord = this.get('coord');
        var transposed = coord.isTransposed;
        var point0 = coord.convertPoint(originPoint.points[0]);
        var point1 = coord.convertPoint(originPoint.points[2]);
        var width = ((point0.x - point1.x) / 2) * (transposed ? -1 : 1);
        var height = ((point0.y - point1.y) / 2) * (transposed ? -1 : 1);
        if (transposed) {
            point.x -= width;
        }
        else {
            point.y += height;
        }
        point.textAlign = 'center';
        point.textBaseline = 'middle';
    };
    FunnelLabel.prototype.getLabelPoint = function (labelOptions, point, index) {
        var total = labelOptions.text.length;
        function getDimValue(value, idx) {
            var v = value;
            if (_.isArray(v)) {
                if (labelOptions.text.length === 1) {
                    // 如果仅一个label,多个值,取最后一个值
                    if (v.length <= 2) {
                        v = v[value.length - 1];
                    }
                    else {
                        v = avg(v);
                    }
                }
                else {
                    v = v[idx];
                }
            }
            return v;
        }
        var label = {
            text: labelOptions.text[index],
            x: 0,
            y: 0,
            start: { x: 0, y: 0 },
            color: '#fff',
        };
        label.x = getDimValue(point.x, index);
        label.y = getDimValue(point.y, index);
        this.setLabelPosition(label, point, index);
        var offsetPoint = this.getLabelOffset(labelOptions, index, total);
        if (labelOptions.offsetX) {
            offsetPoint.x += labelOptions.offsetX;
        }
        if (labelOptions.offsetY) {
            offsetPoint.y += labelOptions.offsetY;
        }
        this.transLabelPoint(label);
        label.start = { x: label.x, y: label.y };
        label.x += offsetPoint.x;
        label.y += offsetPoint.y;
        label.color = point.color;
        return label;
    };
    FunnelLabel.prototype.showLabels = function (points, shapes) {
        var _this = this;
        _super.prototype.showLabels.call(this, points, shapes);
        var renderer = this.get('labelsRenderer');
        var labels = renderer.get('group').get('children');
        var view = this.get('element').get('view');
        _.each(labels, function (label, index) {
            var l = label;
            var origin = l.get('origin');
            var shapeId = _this.get('element').getShapeId(origin);
            var shape = _this._getShape(shapeId, shapes);
            var adjustColor = _this.get('labelOptions').adjustColor;
            if (adjustColor) {
                _this.adjustColor(l, shape);
            }
        });
        view.get('canvas').draw();
    };
    FunnelLabel.prototype.adjustColor = function (label, shape) {
        var shapeColor = shape.attr('fill');
        var shapeOpacity = _.isNumber(shape.attr('opacity')) ? Math.min(Math.max(0, shape.attr('opacity')), 1) : 1;
        var rgb = color_1.rgb2arr(shapeColor);
        var gray = Math.round(rgb[0] * 0.299 + rgb[1] * 0.587 + rgb[2] * 0.114) / shapeOpacity;
        var fill = gray < 156 ? '#f6f6f6' : '#303030';
        label.attr('fill', fill);
        var coord = this.get('coord');
        var shapeBBox = shape.getBBox();
        var _a = coord.invertMatrix(shapeBBox.x, shapeBBox.y, 1), shapeStartX = _a[0], shapeStartY = _a[1];
        var _b = coord.invertMatrix(shapeBBox.width, shapeBBox.height, 0), shapeSizeX = _b[0], shapeSizeY = _b[1];
        var _c = [shapeStartX + shapeSizeX, shapeStartY + shapeSizeY], shapeEndX = _c[0], shapeEndY = _c[1];
        var shapeMinX = Math.min(shapeStartX, shapeEndX);
        var shapeMaxX = Math.max(shapeStartX, shapeEndX);
        var shapeMinY = Math.min(shapeStartY, shapeEndY);
        var shapeMaxY = Math.max(shapeStartY, shapeEndY);
        var compare = shape.get('__compare__');
        if (compare) {
            var yValues = compare.yValues;
            label.attr({
                x: compare.transpose
                    ? (shapeMinX + shapeMaxX) / 2
                    : lerp(shapeMinX, shapeMaxX, yValues[0] / (yValues[0] + yValues[1])),
                y: compare.transpose
                    ? lerp(shapeMinY, shapeMaxY, yValues[0] / (yValues[0] + yValues[1]))
                    : (shapeMinY + shapeMaxY) / 2,
            });
        }
        var labelBBox = label.getBBox();
        var shapeContainsLabel = labelBBox.minX >= shapeMinX &&
            labelBBox.maxX <= shapeMaxX &&
            labelBBox.minY >= shapeMinY &&
            labelBBox.maxY <= shapeMaxY;
        label.set('visible', shapeContainsLabel);
    };
    FunnelLabel.prototype._getShape = function (shapeId, shapes) {
        var target;
        _.each(shapes, function (shape) {
            var s = shape;
            var id = s.id;
            if (id === shapeId) {
                target = s;
            }
        });
        return target;
    };
    return FunnelLabel;
}(g2_1.ElementLabels));
exports.FunnelLabel = FunnelLabel;
g2_1.registerElementLabels('funnelLabel', FunnelLabel);
//# sourceMappingURL=funnel-label.js.map