12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697 |
- "use strict";
- var __rest = (this && this.__rest) || function (s, e) {
- var t = {};
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
- t[p] = s[p];
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
- t[p[i]] = s[p[i]];
- }
- return t;
- };
- Object.defineProperty(exports, "__esModule", { value: true });
- exports.Connector = void 0;
- const gui_1 = require("@antv/gui");
- const d3_shape_1 = require("d3-shape");
- const createElement_1 = require("../../utils/createElement");
- const coordinate_1 = require("../../utils/coordinate");
- const helper_1 = require("../../utils/helper");
- const selection_1 = require("../../utils/selection");
- const utils_1 = require("../utils");
- function inferSymbol(x, y, r) {
- return [['M', x, y], ['L', x + 2 * r, y - r], ['L', x + 2 * r, y + r], ['Z']];
- }
- /**
- * @todo support polar later.
- */
- function inferConnectorPath(points) {
- return (0, d3_shape_1.line)()
- .x((d) => d[0])
- .y((d) => d[1])(points);
- }
- const ConnectorPath = (0, createElement_1.createElement)((g) => {
- // Do not copy className to path.
- const _a = g.attributes, { points, class: className, endMarker = true, direction } = _a, rest = __rest(_a, ["points", "class", "endMarker", "direction"]);
- const markerStyle = (0, helper_1.subObject)(rest, 'endMarker');
- const path = inferConnectorPath(points);
- (0, selection_1.select)(g)
- .maybeAppend('connector', 'path')
- .style('path', path)
- .style('markerEnd', endMarker
- ? new gui_1.Marker({
- className: 'marker',
- style: Object.assign(Object.assign({}, markerStyle), { symbol: inferSymbol }),
- })
- : null)
- .call(utils_1.applyStyle, rest);
- });
- function getPoints(coordinate, points, offset, length1 = 0) {
- const [[x0, y0], [x1, y1]] = points;
- if ((0, coordinate_1.isTranspose)(coordinate)) {
- const OFFSET = offset;
- const X0 = x0 + OFFSET;
- const X1 = x1 + OFFSET;
- const X = X0 + length1;
- return [
- [X0, y0],
- [X, y0],
- [X, y1],
- [X1, y1],
- ];
- }
- const OFFSET = -offset;
- const Y0 = y0 + OFFSET;
- const Y1 = y1 + OFFSET;
- const Y = Y0 + -length1;
- return [
- [x0, Y0],
- [x0, Y],
- [x1, Y],
- [x1, Y1],
- ];
- }
- const Connector = (options) => {
- const { offset = 0, connectLength1: length1 } = options, style = __rest(options, ["offset", "connectLength1"]);
- return (points, value, coordinate, theme) => {
- const { mark, shape, defaultShape } = value;
- const _a = (0, utils_1.getShapeTheme)(theme, mark, shape, defaultShape), { defaultColor, connectLength1 = length1 } = _a, shapeTheme = __rest(_a, ["defaultColor", "connectLength1"]);
- const { color, transform } = value;
- const P = getPoints(coordinate, points, offset, connectLength1);
- return (0, selection_1.select)(new ConnectorPath())
- .call(utils_1.applyStyle, shapeTheme)
- .style('points', P)
- .style('stroke', color || defaultColor)
- .style('transform', transform)
- .call(utils_1.applyStyle, style)
- .node();
- };
- };
- exports.Connector = Connector;
- exports.Connector.props = {
- defaultMarker: 'line',
- defaultEnterAnimation: 'fadeIn',
- defaultUpdateAnimation: 'morphing',
- defaultExitAnimation: 'fadeOut',
- };
- //# sourceMappingURL=connector.js.map
|