path.js 3.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. "use strict";
  2. Object.defineProperty(exports, "__esModule", { value: true });
  3. var tslib_1 = require("tslib");
  4. var util_1 = require("@antv/util");
  5. var constant_1 = require("../constant");
  6. var base_1 = require("./base");
  7. var Path = /** @class */ (function (_super) {
  8. tslib_1.__extends(Path, _super);
  9. function Path() {
  10. var _this = _super !== null && _super.apply(this, arguments) || this;
  11. _this.type = 'path';
  12. _this.canFill = true;
  13. _this.canStroke = true;
  14. return _this;
  15. }
  16. Path.prototype.getDefaultAttrs = function () {
  17. var attrs = _super.prototype.getDefaultAttrs.call(this);
  18. return tslib_1.__assign(tslib_1.__assign({}, attrs), { startArrow: false, endArrow: false });
  19. };
  20. Path.prototype.createPath = function (context, targetAttrs) {
  21. var _this = this;
  22. var attrs = this.attr();
  23. var el = this.get('el');
  24. util_1.each(targetAttrs || attrs, function (value, attr) {
  25. if (attr === 'path' && util_1.isArray(value)) {
  26. el.setAttribute('d', _this._formatPath(value));
  27. }
  28. else if (attr === 'startArrow' || attr === 'endArrow') {
  29. if (value) {
  30. var id = util_1.isObject(value)
  31. ? context.addArrow(attrs, constant_1.SVG_ATTR_MAP[attr])
  32. : context.getDefaultArrow(attrs, constant_1.SVG_ATTR_MAP[attr]);
  33. el.setAttribute(constant_1.SVG_ATTR_MAP[attr], "url(#" + id + ")");
  34. }
  35. else {
  36. el.removeAttribute(constant_1.SVG_ATTR_MAP[attr]);
  37. }
  38. }
  39. else if (constant_1.SVG_ATTR_MAP[attr]) {
  40. el.setAttribute(constant_1.SVG_ATTR_MAP[attr], value);
  41. }
  42. });
  43. };
  44. Path.prototype._formatPath = function (value) {
  45. var newValue = value
  46. .map(function (path) {
  47. return path.join(' ');
  48. })
  49. .join('');
  50. if (~newValue.indexOf('NaN')) {
  51. return '';
  52. }
  53. return newValue;
  54. };
  55. /**
  56. * Get total length of path
  57. * 尽管通过浏览器的 SVGPathElement.getTotalLength() 接口获取的 path 长度,
  58. * 与 Canvas 版本通过数学计算的方式得到的长度有一些细微差异,但最大误差在个位数像素,精度上可以能接受
  59. * @return {number} length
  60. */
  61. Path.prototype.getTotalLength = function () {
  62. var el = this.get('el');
  63. return el ? el.getTotalLength() : null;
  64. };
  65. /**
  66. * Get point according to ratio
  67. * @param {number} ratio
  68. * @return {Point} point
  69. */
  70. Path.prototype.getPoint = function (ratio) {
  71. var el = this.get('el');
  72. var totalLength = this.getTotalLength();
  73. // @see https://github.com/antvis/g/issues/634
  74. if (totalLength === 0) {
  75. return null;
  76. }
  77. var point = el ? el.getPointAtLength(ratio * totalLength) : null;
  78. return point
  79. ? {
  80. x: point.x,
  81. y: point.y,
  82. }
  83. : null;
  84. };
  85. return Path;
  86. }(base_1.default));
  87. exports.default = Path;
  88. //# sourceMappingURL=path.js.map