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.

105 lines
3.4 KiB

9 years ago
  1. import EdgeBase from './util/EdgeBase'
  2. /**
  3. * A Straight Edge.
  4. *
  5. * @class StraightEdge
  6. * @extends EdgeBase
  7. */
  8. class StraightEdge extends EdgeBase {
  9. /**
  10. * @param {Object} options
  11. * @param {Object} body
  12. * @param {Label} labelModule
  13. * @constructor StraightEdge
  14. */
  15. constructor(options, body, labelModule) {
  16. super(options, body, labelModule);
  17. }
  18. /**
  19. * Draw a line between two nodes
  20. * @param {CanvasRenderingContext2D} ctx
  21. * @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
  22. * @private
  23. */
  24. _line(ctx, values) {
  25. // draw a straight line
  26. ctx.beginPath();
  27. ctx.moveTo(this.fromPoint.x, this.fromPoint.y);
  28. ctx.lineTo(this.toPoint.x, this.toPoint.y);
  29. // draw shadow if enabled
  30. this.enableShadow(ctx, values);
  31. ctx.stroke();
  32. this.disableShadow(ctx, values);
  33. }
  34. /**
  35. *
  36. * @returns {undefined}
  37. * @static
  38. */
  39. getViaNode() {
  40. return undefined;
  41. }
  42. /**
  43. * Combined function of pointOnLine and pointOnBezier. This gives the coordinates of a point on the line at a certain percentage of the way
  44. *
  45. * @param {number} percentage
  46. * @returns {{x: number, y: number}}
  47. * @private
  48. */
  49. getPoint(percentage) {
  50. return {
  51. x: (1 - percentage) * this.fromPoint.x + percentage * this.toPoint.x,
  52. y: (1 - percentage) * this.fromPoint.y + percentage * this.toPoint.y
  53. }
  54. }
  55. /**
  56. *
  57. * @param {Node} nearNode
  58. * @param {CanvasRenderingContext2D} ctx
  59. * @returns {{x: number, y: number}}
  60. * @private
  61. */
  62. _findBorderPosition(nearNode, ctx) {
  63. let node1 = this.to;
  64. let node2 = this.from;
  65. if (nearNode.id === this.from.id) {
  66. node1 = this.from;
  67. node2 = this.to;
  68. }
  69. let angle = Math.atan2((node1.y - node2.y), (node1.x - node2.x));
  70. let dx = (node1.x - node2.x);
  71. let dy = (node1.y - node2.y);
  72. let edgeSegmentLength = Math.sqrt(dx * dx + dy * dy);
  73. let toBorderDist = nearNode.distanceToBorder(ctx, angle);
  74. let toBorderPoint = (edgeSegmentLength - toBorderDist) / edgeSegmentLength;
  75. let borderPos = {};
  76. borderPos.x = (1 - toBorderPoint) * node2.x + toBorderPoint * node1.x;
  77. borderPos.y = (1 - toBorderPoint) * node2.y + toBorderPoint * node1.y;
  78. return borderPos;
  79. }
  80. /**
  81. *
  82. * @param {number} x1
  83. * @param {number} y1
  84. * @param {number} x2
  85. * @param {number} y2
  86. * @param {number} x3
  87. * @param {number} y3
  88. * @returns {number}
  89. * @private
  90. */
  91. _getDistanceToEdge(x1, y1, x2, y2, x3, y3) { // x3,y3 is the point
  92. return this._getDistanceToLine(x1, y1, x2, y2, x3, y3);
  93. }
  94. }
  95. export default StraightEdge;