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.

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110
  1. import { v4 as uuid } from "uuid"
  2. import * as vec from "utils/vec"
  3. import { EllipseShape, ShapeType } from "types"
  4. import { createShape } from "./index"
  5. import { boundsContained } from "utils/bounds"
  6. import { intersectEllipseBounds } from "utils/intersections"
  7. import { pointInEllipse } from "utils/hitTests"
  8. const ellipse = createShape<EllipseShape>({
  9. boundsCache: new WeakMap([]),
  10. create(props) {
  11. return {
  12. id: uuid(),
  13. type: ShapeType.Ellipse,
  14. isGenerated: false,
  15. name: "Ellipse",
  16. parentId: "page0",
  17. childIndex: 0,
  18. point: [0, 0],
  19. radiusX: 20,
  20. radiusY: 20,
  21. rotation: 0,
  22. style: {
  23. fill: "#777",
  24. stroke: "#000",
  25. },
  26. ...props,
  27. }
  28. },
  29. render({ id, radiusX, radiusY }) {
  30. return (
  31. <ellipse id={id} cx={radiusX} cy={radiusY} rx={radiusX} ry={radiusY} />
  32. )
  33. },
  34. getBounds(shape) {
  35. if (this.boundsCache.has(shape)) {
  36. return this.boundsCache.get(shape)
  37. }
  38. const {
  39. point: [x, y],
  40. radiusX,
  41. radiusY,
  42. } = shape
  43. const bounds = {
  44. minX: x,
  45. maxX: x + radiusX * 2,
  46. minY: y,
  47. maxY: y + radiusY * 2,
  48. width: radiusX * 2,
  49. height: radiusY * 2,
  50. }
  51. this.boundsCache.set(shape, bounds)
  52. return bounds
  53. },
  54. hitTest(shape, point) {
  55. return pointInEllipse(
  56. point,
  57. vec.add(shape.point, [shape.radiusX, shape.radiusY]),
  58. shape.radiusX,
  59. shape.radiusY
  60. )
  61. },
  62. hitTestBounds(this, shape, brushBounds) {
  63. const shapeBounds = this.getBounds(shape)
  64. return (
  65. boundsContained(shapeBounds, brushBounds) ||
  66. intersectEllipseBounds(
  67. vec.add(shape.point, [shape.radiusX, shape.radiusY]),
  68. shape.radiusX,
  69. shape.radiusY,
  70. brushBounds
  71. ).length > 0
  72. )
  73. },
  74. rotate(shape) {
  75. return shape
  76. },
  77. translate(shape, delta) {
  78. shape.point = vec.add(shape.point, delta)
  79. return shape
  80. },
  81. scale(shape, scale: number) {
  82. return shape
  83. },
  84. transform(shape, bounds) {
  85. shape.point = [bounds.minX, bounds.minY]
  86. shape.radiusX = bounds.width / 2
  87. shape.radiusY = bounds.height / 2
  88. return shape
  89. },
  90. canTransform: true,
  91. })
  92. export default ellipse