interval.js 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189
  1. "use strict";
  2. exports.__esModule = true;
  3. exports["default"] = void 0;
  4. var _vector = _interopRequireDefault(require("../../graphic/util/vector2"));
  5. var _global = _interopRequireDefault(require("../../global"));
  6. var _shape = _interopRequireDefault(require("./shape"));
  7. var _common = require("../../util/common");
  8. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
  9. function getRectPoints(cfg) {
  10. var x = cfg.x,
  11. y = cfg.y,
  12. y0 = cfg.y0,
  13. size = cfg.size;
  14. var ymin = y0;
  15. var ymax = y;
  16. if ((0, _common.isArray)(y)) {
  17. ymax = y[1];
  18. ymin = y[0];
  19. }
  20. var xmin;
  21. var xmax;
  22. if ((0, _common.isArray)(x)) {
  23. xmin = x[0];
  24. xmax = x[1];
  25. } else {
  26. xmin = x - size / 2;
  27. xmax = x + size / 2;
  28. }
  29. return [{
  30. x: xmin,
  31. y: ymin
  32. }, {
  33. x: xmin,
  34. y: ymax
  35. }, {
  36. x: xmax,
  37. y: ymax
  38. }, {
  39. x: xmax,
  40. y: ymin
  41. }];
  42. }
  43. function getRectRange(points) {
  44. var xValues = [];
  45. var yValues = [];
  46. for (var i = 0, len = points.length; i < len; i++) {
  47. var point = points[i];
  48. xValues.push(point.x);
  49. yValues.push(point.y);
  50. }
  51. var xMin = Math.min.apply(null, xValues);
  52. var yMin = Math.min.apply(null, yValues);
  53. var xMax = Math.max.apply(null, xValues);
  54. var yMax = Math.max.apply(null, yValues);
  55. return {
  56. x: xMin,
  57. y: yMin,
  58. width: xMax - xMin,
  59. height: yMax - yMin
  60. };
  61. }
  62. function getMiddlePoint(a, b) {
  63. var x = (a.x - b.x) / 2 + b.x;
  64. var y = (a.y - b.y) / 2 + b.y;
  65. return {
  66. x: x,
  67. y: y
  68. };
  69. }
  70. var Interval = _shape["default"].registerFactory('interval', {
  71. defaultShapeType: 'rect',
  72. getDefaultPoints: function getDefaultPoints(cfg) {
  73. return getRectPoints(cfg);
  74. }
  75. });
  76. _shape["default"].registerShape('interval', 'rect', {
  77. draw: function draw(cfg, container) {
  78. var points = this.parsePoints(cfg.points);
  79. var style = (0, _common.mix)({
  80. fill: cfg.color
  81. }, _global["default"].shape.interval, cfg.style);
  82. if (cfg.isInCircle) {
  83. var newPoints = points.slice(0);
  84. if (this._coord.transposed) {
  85. newPoints = [points[0], points[3], points[2], points[1]];
  86. }
  87. var _cfg$center = cfg.center,
  88. x = _cfg$center.x,
  89. y = _cfg$center.y;
  90. var v = [1, 0];
  91. var v0 = [newPoints[0].x - x, newPoints[0].y - y];
  92. var v1 = [newPoints[1].x - x, newPoints[1].y - y];
  93. var v2 = [newPoints[2].x - x, newPoints[2].y - y];
  94. var startAngle = _vector["default"].angleTo(v, v1);
  95. var endAngle = _vector["default"].angleTo(v, v2);
  96. var r0 = _vector["default"].length(v0);
  97. var r = _vector["default"].length(v1);
  98. if (startAngle >= 1.5 * Math.PI) {
  99. startAngle = startAngle - 2 * Math.PI;
  100. }
  101. if (endAngle >= 1.5 * Math.PI) {
  102. endAngle = endAngle - 2 * Math.PI;
  103. }
  104. return container.addShape('Sector', {
  105. className: 'interval',
  106. attrs: (0, _common.mix)({
  107. x: x,
  108. y: y,
  109. r: r,
  110. r0: r0,
  111. startAngle: startAngle,
  112. endAngle: endAngle
  113. }, style)
  114. });
  115. }
  116. var rectCfg = getRectRange(points);
  117. return container.addShape('rect', {
  118. className: 'interval',
  119. attrs: (0, _common.mix)(rectCfg, style)
  120. });
  121. }
  122. }); // 金字塔 和 漏斗图
  123. ['pyramid', 'funnel'].forEach(function (shapeType) {
  124. _shape["default"].registerShape('interval', shapeType, {
  125. getPoints: function getPoints(cfg) {
  126. cfg.size = cfg.size * 2; // 漏斗图的 size 是柱状图的两倍
  127. return getRectPoints(cfg);
  128. },
  129. draw: function draw(cfg, container) {
  130. var points = this.parsePoints(cfg.points);
  131. var nextPoints = this.parsePoints(cfg.nextPoints);
  132. var polygonPoints = null;
  133. if (nextPoints) {
  134. polygonPoints = [points[0], points[1], nextPoints[1], nextPoints[0]];
  135. } else {
  136. polygonPoints = [points[0], points[1]]; // pyramid 顶部是三角形,所以取中心点就好了,funnel顶部是长方形
  137. if (shapeType === 'pyramid') {
  138. polygonPoints.push(getMiddlePoint(points[2], points[3]));
  139. } else {
  140. polygonPoints.push(points[2], points[3]);
  141. }
  142. }
  143. var attrs = (0, _common.mix)({
  144. fill: cfg.color,
  145. points: polygonPoints
  146. }, _global["default"].shape.interval, cfg.style);
  147. return container.addShape('polygon', {
  148. className: 'interval',
  149. attrs: attrs
  150. });
  151. }
  152. });
  153. });
  154. var _default = Interval;
  155. exports["default"] = _default;