vis.js is a dynamic, browser-based visualization library
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

74 lines
2.7 KiB

  1. 'use strict';
  2. import NodeBase from '../util/NodeBase'
  3. /**
  4. * Am Ellipse Node/Cluster shape.
  5. *
  6. * @extends NodeBase
  7. */
  8. class Ellipse extends NodeBase {
  9. /**
  10. * @param {Object} options
  11. * @param {Object} body
  12. * @param {Label} labelModule
  13. */
  14. constructor(options, body, labelModule) {
  15. super(options, body, labelModule);
  16. }
  17. /**
  18. *
  19. * @param {CanvasRenderingContext2D} ctx
  20. * @param {boolean} [selected]
  21. * @param {boolean} [hover]
  22. */
  23. resize(ctx, selected = this.selected, hover = this.hover) {
  24. if (this.needsRefresh(selected, hover)) {
  25. var dimensions = this.getDimensionsFromLabel(ctx, selected, hover);
  26. this.height = dimensions.height * 2;
  27. this.width = dimensions.width + dimensions.height;
  28. this.radius = 0.5*this.width;
  29. }
  30. }
  31. /**
  32. *
  33. * @param {CanvasRenderingContext2D} ctx
  34. * @param {number} x width
  35. * @param {number} y height
  36. * @param {boolean} selected
  37. * @param {boolean} hover
  38. * @param {{toArrow: boolean, toArrowScale: (allOptions.edges.arrows.to.scaleFactor|{number}|allOptions.edges.arrows.middle.scaleFactor|allOptions.edges.arrows.from.scaleFactor|Array|number), toArrowType: *, middleArrow: boolean, middleArrowScale: (number|allOptions.edges.arrows.middle.scaleFactor|{number}|Array), middleArrowType: (allOptions.edges.arrows.middle.type|{string}|string|*), fromArrow: boolean, fromArrowScale: (allOptions.edges.arrows.to.scaleFactor|{number}|allOptions.edges.arrows.middle.scaleFactor|allOptions.edges.arrows.from.scaleFactor|Array|number), fromArrowType: *, arrowStrikethrough: (*|boolean|allOptions.edges.arrowStrikethrough|{boolean}), color: undefined, inheritsColor: (string|string|string|allOptions.edges.color.inherit|{string, boolean}|Array|*), opacity: *, hidden: *, length: *, shadow: *, shadowColor: *, shadowSize: *, shadowX: *, shadowY: *, dashes: (*|boolean|Array|allOptions.edges.dashes|{boolean, array}), width: *}} values
  39. */
  40. draw(ctx, x, y, selected, hover, values) {
  41. this.resize(ctx, selected, hover);
  42. this.left = x - this.width * 0.5;
  43. this.top = y - this.height * 0.5;
  44. this.initContextForDraw(ctx, values);
  45. ctx.ellipse_vis(this.left, this.top, this.width, this.height);
  46. this.performFill(ctx, values);
  47. this.updateBoundingBox(x, y, ctx, selected, hover);
  48. this.labelModule.draw(ctx, x, y, selected, hover);
  49. }
  50. /**
  51. *
  52. * @param {CanvasRenderingContext2D} ctx
  53. * @param {number} angle
  54. * @returns {number}
  55. */
  56. distanceToBorder(ctx, angle) {
  57. this.resize(ctx);
  58. var a = this.width * 0.5;
  59. var b = this.height * 0.5;
  60. var w = (Math.sin(angle) * a);
  61. var h = (Math.cos(angle) * b);
  62. return a * b / Math.sqrt(w * w + h * h);
  63. }
  64. }
  65. export default Ellipse;