@antv/g2plot
Version:
G2 Plot, a market of plots built with the Grammar of Graphics'
156 lines • 6.33 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var g2_1 = require("@antv/g2");
var _ = tslib_1.__importStar(require("@antv/util"));
var color_1 = require("../../../../util/color");
var RIGHT_MARGIN = 20;
var BarLabels = /** @class */ (function (_super) {
tslib_1.__extends(BarLabels, _super);
function BarLabels() {
return _super !== null && _super.apply(this, arguments) || this;
}
// TODO: 先实现功能，待抽象 position这里去掉在条形图场景下不必要的逻辑，位置计算调整
BarLabels.prototype.setLabelPosition = function (point, originPoint, index, originPosition) {
var position = originPosition;
if (_.isFunction(position)) {
position = position(originPoint);
}
var coord = this.get('coord');
var point0 = coord.convertPoint(originPoint.points[0]);
var point1 = coord.convertPoint(originPoint.points[2]);
var negative = point0.x > point1.x;
var width = ((point0.x - point1.x) / 2) * -1;
var height = ((point0.y - point1.y) / 2) * -1;
switch (position) {
case 'bottom':
point.x -= width;
point.y += height;
point.textAlign = point.textAlign || 'center';
break;
case 'top':
point.x -= width;
point.y -= height;
point.textAlign = point.textAlign || 'center';
break;
case 'left':
point.x -= width * 2;
point.textAlign = point.textAlign || (negative ? 'right' : 'left');
break;
case 'middle':
point.x -= width;
point.textAlign = point.textAlign || 'center';
break;
case 'right':
point.textAlign = point.textAlign || (negative ? 'right' : 'left');
break;
default:
break;
}
};
// 针对负数值的label调整
BarLabels.prototype.adjustOffset = function (points, shapes) {
var renderer = this.get('labelsRenderer');
var items = renderer.get('items');
var labels = renderer.get('group').get('children');
var coord = this.get('coord');
_.each(items, function (item, idx) {
var label = labels[idx];
var point0 = coord.convertPoint(points[idx].points[0]);
var point1 = coord.convertPoint(points[idx].points[2]);
var negative = point0.x > point1.x;
if (negative && item.offset) {
item.x -= item.offset * 2;
label.attr('x', label.attr('x') - item.offset * 2);
}
});
};
BarLabels.prototype.showLabels = function (points, shapes) {
var _this = this;
_super.prototype.showLabels.call(this, points, shapes);
this.adjustOffset(points, shapes);
var renderer = this.get('labelsRenderer');
var labels = renderer.get('group').get('children');
var items = renderer.get('items');
var view = this.get('element').get('view');
var _a = this.get('labelOptions'), adjustColor = _a.adjustColor, adjustPosition = _a.adjustPosition;
_.each(labels, function (label, index) {
var l = label;
var item = items[index];
var origin = l.get('origin');
var shapeId = _this.get('element').getShapeId(origin);
var shape = _this._getShape(shapeId, shapes);
if (adjustPosition) {
_this.adjustPosition(l, shape, item);
}
if (adjustColor) {
_this.adjustColor(l, shape);
}
});
view.get('canvas').draw();
};
BarLabels.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;
};
BarLabels.prototype.adjustPosition = function (label, shape, item) {
var labelRange = label.getBBox();
var shapeRange = shape.getBBox();
if (shapeRange.width <= labelRange.width && item.position !== 'right') {
var xPosition = shapeRange.maxX + RIGHT_MARGIN;
label.attr('x', xPosition);
}
};
BarLabels.prototype.adjustColor = function (label, shape) {
var labelRange = label.getBBox();
var shapeRange = shape.getBBox();
if (labelRange.minX >= shapeRange.minX && labelRange.maxX <= shapeRange.maxX) {
var shapeColor = shape.attr('fill');
var shapeOpacity = shape.attr('opacity') ? shape.attr('opacity') : 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 colorBand = [
{ from: 0, to: 85, color: 'white' },
{ from: 85, to: 170, color: '#F6F6F6' },
{ from: 170, to: 255, color: 'black' },
];
var reflect = this._mappingColor(colorBand, gray);
label.attr('fill', reflect);
label.attr('fill', reflect);
if (reflect !== 'black') {
label.attr('stroke', null);
label.attr('lineWidth', 0);
}
else {
label.attr('stroke', 'white');
label.attr('lineWidth', 2);
}
}
else if (labelRange.maxY < shapeRange.minY) {
var theme = this.get('theme');
var labelTextColor = _.get(theme, 'label.textStyle.fill', 'black');
label.attr('fill', labelTextColor);
}
};
BarLabels.prototype._mappingColor = function (band, gray) {
var reflect;
_.each(band, function (b) {
var map = b;
if (gray >= map.from && gray < map.to) {
reflect = map.color;
}
});
return reflect;
};
return BarLabels;
}(g2_1.ElementLabels));
exports.BarLabels = BarLabels;
g2_1.registerElementLabels('barLabel', BarLabels);
//# sourceMappingURL=bar-label.js.map