3ee5ebf1849191236301f6a3dc84aa9a3911c7c37a2b8bb1d11c980e042dff0b3037955c423efa20b44de3b36fb421f7417513f600fa6fe0173d7bb2f59f4b 8.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
  4. var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
  5. var _cRender = require("@jiaminghi/c-render");
  6. var _graphs = require("@jiaminghi/c-render/lib/config/graphs");
  7. var _util = require("@jiaminghi/c-render/lib/plugin/util");
  8. var _color = require("@jiaminghi/color");
  9. var _index = require("../util/index");
  10. function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
  11. function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
  12. var pie = {
  13. shape: {
  14. rx: 0,
  15. ry: 0,
  16. ir: 0,
  17. or: 0,
  18. startAngle: 0,
  19. endAngle: 0,
  20. clockWise: true
  21. },
  22. validator: function validator(_ref) {
  23. var shape = _ref.shape;
  24. var keys = ['rx', 'ry', 'ir', 'or', 'startAngle', 'endAngle'];
  25. if (keys.find(function (key) {
  26. return typeof shape[key] !== 'number';
  27. })) {
  28. console.error('Pie shape configuration is abnormal!');
  29. return false;
  30. }
  31. return true;
  32. },
  33. draw: function draw(_ref2, _ref3) {
  34. var ctx = _ref2.ctx;
  35. var shape = _ref3.shape;
  36. ctx.beginPath();
  37. var rx = shape.rx,
  38. ry = shape.ry,
  39. ir = shape.ir,
  40. or = shape.or,
  41. startAngle = shape.startAngle,
  42. endAngle = shape.endAngle,
  43. clockWise = shape.clockWise;
  44. rx = parseInt(rx) + 0.5;
  45. ry = parseInt(ry) + 0.5;
  46. ctx.arc(rx, ry, ir > 0 ? ir : 0, startAngle, endAngle, !clockWise);
  47. var connectPoint1 = (0, _util.getCircleRadianPoint)(rx, ry, or, endAngle).map(function (p) {
  48. return parseInt(p) + 0.5;
  49. });
  50. var connectPoint2 = (0, _util.getCircleRadianPoint)(rx, ry, ir, startAngle).map(function (p) {
  51. return parseInt(p) + 0.5;
  52. });
  53. ctx.lineTo.apply(ctx, (0, _toConsumableArray2["default"])(connectPoint1));
  54. ctx.arc(rx, ry, or > 0 ? or : 0, endAngle, startAngle, clockWise);
  55. ctx.lineTo.apply(ctx, (0, _toConsumableArray2["default"])(connectPoint2));
  56. ctx.closePath();
  57. ctx.stroke();
  58. ctx.fill();
  59. }
  60. };
  61. var agArc = {
  62. shape: {
  63. rx: 0,
  64. ry: 0,
  65. r: 0,
  66. startAngle: 0,
  67. endAngle: 0,
  68. gradientStartAngle: null,
  69. gradientEndAngle: null
  70. },
  71. validator: function validator(_ref4) {
  72. var shape = _ref4.shape;
  73. var keys = ['rx', 'ry', 'r', 'startAngle', 'endAngle'];
  74. if (keys.find(function (key) {
  75. return typeof shape[key] !== 'number';
  76. })) {
  77. console.error('AgArc shape configuration is abnormal!');
  78. return false;
  79. }
  80. return true;
  81. },
  82. draw: function draw(_ref5, _ref6) {
  83. var ctx = _ref5.ctx;
  84. var shape = _ref6.shape,
  85. style = _ref6.style;
  86. var gradient = style.gradient;
  87. gradient = gradient.map(function (cv) {
  88. return (0, _color.getColorFromRgbValue)(cv);
  89. });
  90. if (gradient.length === 1) {
  91. gradient = [gradient[0], gradient[0]];
  92. }
  93. var gradientArcNum = gradient.length - 1;
  94. var gradientStartAngle = shape.gradientStartAngle,
  95. gradientEndAngle = shape.gradientEndAngle,
  96. startAngle = shape.startAngle,
  97. endAngle = shape.endAngle,
  98. r = shape.r,
  99. rx = shape.rx,
  100. ry = shape.ry;
  101. if (gradientStartAngle === null) gradientStartAngle = startAngle;
  102. if (gradientEndAngle === null) gradientEndAngle = endAngle;
  103. var angleGap = (gradientEndAngle - gradientStartAngle) / gradientArcNum;
  104. if (angleGap === Math.PI * 2) angleGap = Math.PI * 2 - 0.001;
  105. for (var i = 0; i < gradientArcNum; i++) {
  106. ctx.beginPath();
  107. var startPoint = (0, _util.getCircleRadianPoint)(rx, ry, r, startAngle + angleGap * i);
  108. var endPoint = (0, _util.getCircleRadianPoint)(rx, ry, r, startAngle + angleGap * (i + 1));
  109. var color = (0, _index.getLinearGradientColor)(ctx, startPoint, endPoint, [gradient[i], gradient[i + 1]]);
  110. var arcStartAngle = startAngle + angleGap * i;
  111. var arcEndAngle = startAngle + angleGap * (i + 1);
  112. var doBreak = false;
  113. if (arcEndAngle > endAngle) {
  114. arcEndAngle = endAngle;
  115. doBreak = true;
  116. }
  117. ctx.arc(rx, ry, r, arcStartAngle, arcEndAngle);
  118. ctx.strokeStyle = color;
  119. ctx.stroke();
  120. if (doBreak) break;
  121. }
  122. }
  123. };
  124. var numberText = {
  125. shape: {
  126. number: [],
  127. content: '',
  128. position: [0, 0],
  129. toFixed: 0,
  130. rowGap: 0,
  131. formatter: null
  132. },
  133. validator: function validator(_ref7) {
  134. var shape = _ref7.shape;
  135. var number = shape.number,
  136. content = shape.content,
  137. position = shape.position;
  138. if (!(number instanceof Array) || typeof content !== 'string' || !(position instanceof Array)) {
  139. console.error('NumberText shape configuration is abnormal!');
  140. return false;
  141. }
  142. return true;
  143. },
  144. draw: function draw(_ref8, _ref9) {
  145. var ctx = _ref8.ctx;
  146. var shape = _ref9.shape;
  147. var number = shape.number,
  148. content = shape.content,
  149. toFixed = shape.toFixed,
  150. rowGap = shape.rowGap,
  151. formatter = shape.formatter;
  152. var textSegments = content.split('{nt}');
  153. var textString = '';
  154. textSegments.forEach(function (t, i) {
  155. var currentNumber = number[i];
  156. if (typeof currentNumber !== 'number') currentNumber = '';
  157. if (typeof currentNumber === 'number') {
  158. currentNumber = currentNumber.toFixed(toFixed);
  159. if (typeof formatter === 'function') currentNumber = formatter(currentNumber);
  160. }
  161. textString += t + (currentNumber || '');
  162. });
  163. _graphs.text.draw({
  164. ctx: ctx
  165. }, {
  166. shape: _objectSpread(_objectSpread({}, shape), {}, {
  167. content: textString,
  168. rowGap: rowGap
  169. })
  170. });
  171. }
  172. };
  173. var lineIcon = {
  174. shape: {
  175. x: 0,
  176. y: 0,
  177. w: 0,
  178. h: 0
  179. },
  180. validator: function validator(_ref10) {
  181. var shape = _ref10.shape;
  182. var x = shape.x,
  183. y = shape.y,
  184. w = shape.w,
  185. h = shape.h;
  186. if (typeof x !== 'number' || typeof y !== 'number' || typeof w !== 'number' || typeof h !== 'number') {
  187. console.error('lineIcon shape configuration is abnormal!');
  188. return false;
  189. }
  190. return true;
  191. },
  192. draw: function draw(_ref11, _ref12) {
  193. var ctx = _ref11.ctx;
  194. var shape = _ref12.shape;
  195. ctx.beginPath();
  196. var x = shape.x,
  197. y = shape.y,
  198. w = shape.w,
  199. h = shape.h;
  200. var halfH = h / 2;
  201. ctx.strokeStyle = ctx.fillStyle;
  202. ctx.moveTo(x, y + halfH);
  203. ctx.lineTo(x + w, y + halfH);
  204. ctx.lineWidth = 1;
  205. ctx.stroke();
  206. ctx.beginPath();
  207. var radius = halfH - 5 * 2;
  208. if (radius <= 0) radius = 3;
  209. ctx.arc(x + w / 2, y + halfH, radius, 0, Math.PI * 2);
  210. ctx.lineWidth = 5;
  211. ctx.stroke();
  212. ctx.fillStyle = '#fff';
  213. ctx.fill();
  214. },
  215. hoverCheck: function hoverCheck(position, _ref13) {
  216. var shape = _ref13.shape;
  217. var x = shape.x,
  218. y = shape.y,
  219. w = shape.w,
  220. h = shape.h;
  221. return (0, _util.checkPointIsInRect)(position, x, y, w, h);
  222. },
  223. setGraphCenter: function setGraphCenter(e, _ref14) {
  224. var shape = _ref14.shape,
  225. style = _ref14.style;
  226. var x = shape.x,
  227. y = shape.y,
  228. w = shape.w,
  229. h = shape.h;
  230. style.graphCenter = [x + w / 2, y + h / 2];
  231. }
  232. };
  233. (0, _cRender.extendNewGraph)('pie', pie);
  234. (0, _cRender.extendNewGraph)('agArc', agArc);
  235. (0, _cRender.extendNewGraph)('numberText', numberText);
  236. (0, _cRender.extendNewGraph)('lineIcon', lineIcon);