@antv/g2
Version:
the Grammar of Graphics in Javascript
121 lines • 5.46 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.getDefaultStyle = exports.inferIdentityStyle = exports.inferRotation = exports.pointOfArc = exports.inferRadialStyle = exports.inferNonCircularStyle = void 0;
const utils_1 = require("../../../shape/utils");
const coordinate_1 = require("../../../utils/coordinate");
const helper_1 = require("../../../utils/helper");
const vector_1 = require("../../../utils/vector");
function inferNonCircularStyle(position, points, value, coordinate) {
const { bounds } = value;
const [[x0, y0], [x1, y1]] = bounds;
const w = x1 - x0;
const h = y1 - y0;
const xy = (options) => {
const { x: ox, y: oy } = options;
const px = (0, helper_1.maybePercentage)(value.x, w);
const py = (0, helper_1.maybePercentage)(value.y, h);
return Object.assign(Object.assign({}, options), { x: (px || ox) + x0, y: (py || oy) + y0 });
};
// 4 direction.
if (position === 'left')
return xy({ x: 0, y: h / 2, textAlign: 'start', textBaseline: 'middle' });
if (position === 'right')
return xy({ x: w, y: h / 2, textAlign: 'end', textBaseline: 'middle' });
if (position === 'top')
return xy({ x: w / 2, y: 0, textAlign: 'center', textBaseline: 'top' });
if (position === 'bottom')
return xy({ x: w / 2, y: h, textAlign: 'center', textBaseline: 'bottom' });
// 4 corner position.
if (position === 'top-left')
return xy({ x: 0, y: 0, textAlign: 'start', textBaseline: 'top' });
if (position === 'top-right')
return xy({ x: w, y: 0, textAlign: 'end', textBaseline: 'top' });
if (position === 'bottom-left')
return xy({ x: 0, y: h, textAlign: 'start', textBaseline: 'bottom' });
if (position === 'bottom-right')
return xy({ x: w, y: h, textAlign: 'end', textBaseline: 'bottom' });
// default return 'inside'
return xy({
x: w / 2,
y: h / 2,
textAlign: 'center',
textBaseline: 'middle',
});
}
exports.inferNonCircularStyle = inferNonCircularStyle;
function inferRadialStyle(position, points, value, coordinate) {
const { y, y1, autoRotate, rotateToAlignArc } = value;
const center = coordinate.getCenter();
const arcObject = (0, utils_1.getArcObject)(coordinate, points, [y, y1]);
const { innerRadius, outerRadius, startAngle, endAngle } = arcObject;
const angle = position === 'inside' ? (startAngle + endAngle) / 2 : endAngle;
const rotate = inferRotation(angle, autoRotate, rotateToAlignArc);
const point = (() => {
const [p0, p1] = points;
const radius = innerRadius + (outerRadius - innerRadius) * 0.5;
const [x, y] = position === 'inside' ? pointOfArc(center, angle, radius) : (0, vector_1.mid)(p0, p1);
return { x, y };
})();
return Object.assign(Object.assign({}, point), { textAlign: position === 'inside' ? 'center' : 'start', textBaseline: 'middle', rotate });
}
exports.inferRadialStyle = inferRadialStyle;
function pointOfArc(center, angle, radius) {
return [
center[0] + Math.sin(angle) * radius,
center[1] - Math.cos(angle) * radius,
];
}
exports.pointOfArc = pointOfArc;
function inferRotation(angle, autoRotate, rotateToAlignArc) {
if (!autoRotate)
return 0;
const append = rotateToAlignArc ? 0 : Math.sin(angle) < 0 ? 90 : -90;
return (angle / Math.PI) * 180 + append;
}
exports.inferRotation = inferRotation;
function inferInnerCircularStyle(position, points, value, coordinate) {
const { y, y1, autoRotate, rotateToAlignArc, radius: radiusRatio = 0.5, offset = 0, } = value;
const arcObject = (0, utils_1.getArcObject)(coordinate, points, [y, y1]);
const { startAngle, endAngle } = arcObject;
const center = coordinate.getCenter();
const angle = (startAngle + endAngle) / 2;
const rotate = inferRotation(angle, autoRotate, rotateToAlignArc);
const textStyle = { textAlign: 'center', textBaseline: 'middle', rotate };
const { innerRadius, outerRadius } = arcObject;
const r0 = innerRadius + (outerRadius - innerRadius) * radiusRatio;
const r1 = r0 + offset;
const [x0, y0] = pointOfArc(center, angle, r1);
return Object.assign({ x: x0, y: y0 }, textStyle);
}
// Set to null will not be set with default value as below.
// const { x = 0 } = options;
function maybeUndefined(d) {
return d === undefined ? null : d;
}
function inferIdentityStyle(position, points, value, coordinate) {
const { bounds } = value;
const [p] = bounds;
return {
x: maybeUndefined(p[0]),
y: maybeUndefined(p[1]),
};
}
exports.inferIdentityStyle = inferIdentityStyle;
function getDefaultStyle(position, points, value, coordinate) {
const { bounds } = value;
// When bounds.length = 1
// For series mark, such as line and area.
// The bounds for text is defined with only one point.
// Use this point as the label position.
if (bounds.length === 1) {
return inferIdentityStyle(position, points, value, coordinate);
}
const inferDefaultStyle = (0, coordinate_1.isRadial)(coordinate)
? inferRadialStyle
: (0, coordinate_1.isCircular)(coordinate)
? inferInnerCircularStyle
: inferNonCircularStyle;
return inferDefaultStyle(position, points, value, coordinate);
}
exports.getDefaultStyle = getDefaultStyle;
//# sourceMappingURL=default.js.map