arc.js 1.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. import { mix } from '../../util/common';
  2. import GuideBase from './base';
  3. class Arc extends GuideBase {
  4. _initDefaultCfg() {
  5. this.type = 'arc';
  6. /**
  7. * start point
  8. * @type {Array | Function}
  9. */
  10. this.start = [];
  11. /**
  12. * end point
  13. * @type {Array | Function}
  14. */
  15. this.end = [];
  16. /**
  17. * style configuration
  18. * @type {Object}
  19. */
  20. this.style = {
  21. stroke: '#999',
  22. lineWidth: 1
  23. };
  24. }
  25. render(coord, container) {
  26. var self = this;
  27. var start = self.parsePoint(coord, self.start);
  28. var end = self.parsePoint(coord, self.end);
  29. if (!start || !end) {
  30. return;
  31. }
  32. var coordCenter = coord.center;
  33. var radius = Math.sqrt((start.x - coordCenter.x) * (start.x - coordCenter.x) + (start.y - coordCenter.y) * (start.y - coordCenter.y));
  34. var startAngle = Math.atan2(start.y - coordCenter.y, start.x - coordCenter.x);
  35. var endAngle = Math.atan2(end.y - coordCenter.y, end.x - coordCenter.x);
  36. var shape = container.addShape('arc', {
  37. className: 'guide-arc',
  38. attrs: mix({
  39. x: coordCenter.x,
  40. y: coordCenter.y,
  41. r: radius,
  42. startAngle,
  43. endAngle
  44. }, self.style)
  45. });
  46. self.element = shape;
  47. return shape;
  48. }
  49. }
  50. GuideBase.Arc = Arc;
  51. export default Arc;