group.js 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596
  1. import { __extends } from "tslib";
  2. import { AbstractGroup } from '@antv/g-base';
  3. import { each } from '@antv/util';
  4. import * as Shape from './shape';
  5. import { drawChildren, refreshElement } from './util/draw';
  6. import { setClip, setTransform } from './util/svg';
  7. import { SVG_ATTR_MAP } from './constant';
  8. import { createSVGElement } from './util/dom';
  9. var Group = /** @class */ (function (_super) {
  10. __extends(Group, _super);
  11. function Group() {
  12. return _super !== null && _super.apply(this, arguments) || this;
  13. }
  14. // SVG 中分组对应实体标签 <g>
  15. Group.prototype.isEntityGroup = function () {
  16. return true;
  17. };
  18. Group.prototype.createDom = function () {
  19. var element = createSVGElement('g');
  20. this.set('el', element);
  21. var parent = this.getParent();
  22. if (parent) {
  23. var parentNode = parent.get('el');
  24. if (parentNode) {
  25. parentNode.appendChild(element);
  26. }
  27. else {
  28. // parentNode maybe null for group
  29. parentNode = parent.createDom();
  30. parent.set('el', parentNode);
  31. parentNode.appendChild(element);
  32. }
  33. }
  34. return element;
  35. };
  36. // 覆盖基类的 afterAttrsChange 方法
  37. Group.prototype.afterAttrsChange = function (targetAttrs) {
  38. _super.prototype.afterAttrsChange.call(this, targetAttrs);
  39. var canvas = this.get('canvas');
  40. // 只有挂载到画布下,才对元素进行实际渲染
  41. if (canvas && canvas.get('autoDraw')) {
  42. var context = canvas.get('context');
  43. this.createPath(context, targetAttrs);
  44. }
  45. };
  46. /**
  47. * 一些方法调用会引起画布变化
  48. * @param {ChangeType} changeType 改变的类型
  49. */
  50. Group.prototype.onCanvasChange = function (changeType) {
  51. refreshElement(this, changeType);
  52. };
  53. Group.prototype.getShapeBase = function () {
  54. return Shape;
  55. };
  56. Group.prototype.getGroupBase = function () {
  57. return Group;
  58. };
  59. Group.prototype.draw = function (context) {
  60. var children = this.getChildren();
  61. var el = this.get('el');
  62. if (this.get('destroyed')) {
  63. if (el) {
  64. el.parentNode.removeChild(el);
  65. }
  66. }
  67. else {
  68. if (!el) {
  69. this.createDom();
  70. }
  71. setClip(this, context);
  72. this.createPath(context);
  73. if (children.length) {
  74. drawChildren(context, children);
  75. }
  76. }
  77. };
  78. /**
  79. * 绘制分组的路径
  80. * @param {Defs} context 上下文
  81. * @param {ShapeAttrs} targetAttrs 渲染的目标属性
  82. */
  83. Group.prototype.createPath = function (context, targetAttrs) {
  84. var attrs = this.attr();
  85. var el = this.get('el');
  86. each(targetAttrs || attrs, function (value, attr) {
  87. if (SVG_ATTR_MAP[attr]) {
  88. el.setAttribute(SVG_ATTR_MAP[attr], value);
  89. }
  90. });
  91. setTransform(this);
  92. };
  93. return Group;
  94. }(AbstractGroup));
  95. export default Group;
  96. //# sourceMappingURL=group.js.map