rect.js 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293
  1. "use strict";
  2. /**
  3. * @fileoverview rect
  4. * @author dengfuping_develop@163.com
  5. */
  6. Object.defineProperty(exports, "__esModule", { value: true });
  7. var tslib_1 = require("tslib");
  8. var util_1 = require("@antv/util");
  9. var base_1 = require("./base");
  10. var constant_1 = require("../constant");
  11. var format_1 = require("../util/format");
  12. var Rect = /** @class */ (function (_super) {
  13. tslib_1.__extends(Rect, _super);
  14. function Rect() {
  15. var _this = _super !== null && _super.apply(this, arguments) || this;
  16. _this.type = 'rect';
  17. _this.canFill = true;
  18. _this.canStroke = true;
  19. return _this;
  20. }
  21. Rect.prototype.getDefaultAttrs = function () {
  22. var attrs = _super.prototype.getDefaultAttrs.call(this);
  23. return tslib_1.__assign(tslib_1.__assign({}, attrs), { x: 0, y: 0, width: 0, height: 0, radius: 0 });
  24. };
  25. Rect.prototype.createPath = function (context, targetAttrs) {
  26. var _this = this;
  27. var attrs = this.attr();
  28. var el = this.get('el');
  29. // 加上状态量,用来标记 path 是否已组装
  30. var completed = false;
  31. // 和组装 path 相关的绘图属性
  32. var pathRelatedAttrs = ['x', 'y', 'width', 'height', 'radius'];
  33. util_1.each(targetAttrs || attrs, function (value, attr) {
  34. if (pathRelatedAttrs.indexOf(attr) !== -1 && !completed) {
  35. el.setAttribute('d', _this._assembleRect(attrs));
  36. completed = true;
  37. }
  38. else if (pathRelatedAttrs.indexOf(attr) === -1 && constant_1.SVG_ATTR_MAP[attr]) {
  39. el.setAttribute(constant_1.SVG_ATTR_MAP[attr], value);
  40. }
  41. });
  42. };
  43. Rect.prototype._assembleRect = function (attrs) {
  44. var x = attrs.x;
  45. var y = attrs.y;
  46. var w = attrs.width;
  47. var h = attrs.height;
  48. var radius = attrs.radius;
  49. if (!radius) {
  50. return "M " + x + "," + y + " l " + w + ",0 l 0," + h + " l" + -w + " 0 z";
  51. }
  52. var r = format_1.parseRadius(radius);
  53. if (util_1.isArray(radius)) {
  54. if (radius.length === 1) {
  55. r.r1 = r.r2 = r.r3 = r.r4 = radius[0];
  56. }
  57. else if (radius.length === 2) {
  58. r.r1 = r.r3 = radius[0];
  59. r.r2 = r.r4 = radius[1];
  60. }
  61. else if (radius.length === 3) {
  62. r.r1 = radius[0];
  63. r.r2 = r.r4 = radius[1];
  64. r.r3 = radius[2];
  65. }
  66. else {
  67. r.r1 = radius[0];
  68. r.r2 = radius[1];
  69. r.r3 = radius[2];
  70. r.r4 = radius[3];
  71. }
  72. }
  73. else {
  74. r.r1 = r.r2 = r.r3 = r.r4 = radius;
  75. }
  76. var d = [
  77. ["M " + (x + r.r1) + "," + y],
  78. ["l " + (w - r.r1 - r.r2) + ",0"],
  79. ["a " + r.r2 + "," + r.r2 + ",0,0,1," + r.r2 + "," + r.r2],
  80. ["l 0," + (h - r.r2 - r.r3)],
  81. ["a " + r.r3 + "," + r.r3 + ",0,0,1," + -r.r3 + "," + r.r3],
  82. ["l " + (r.r3 + r.r4 - w) + ",0"],
  83. ["a " + r.r4 + "," + r.r4 + ",0,0,1," + -r.r4 + "," + -r.r4],
  84. ["l 0," + (r.r4 + r.r1 - h)],
  85. ["a " + r.r1 + "," + r.r1 + ",0,0,1," + r.r1 + "," + -r.r1],
  86. ['z'],
  87. ];
  88. return d.join(' ');
  89. };
  90. return Rect;
  91. }(base_1.default));
  92. exports.default = Rect;
  93. //# sourceMappingURL=rect.js.map