Nelze vybrat více než 25 témat Téma musí začínat písmenem nebo číslem, může obsahovat pomlčky („-“) a může být dlouhé až 35 znaků.

ray.tsx 2.4KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118
  1. import { v4 as uuid } from 'uuid'
  2. import * as vec from 'utils/vec'
  3. import { RayShape, ShapeType } from 'types'
  4. import { registerShapeUtils } from './index'
  5. import { boundsContained } from 'utils/bounds'
  6. import { intersectCircleBounds } from 'utils/intersections'
  7. import { DotCircle, ThinLine } from 'components/canvas/misc'
  8. import { translateBounds } from 'utils/utils'
  9. const ray = registerShapeUtils<RayShape>({
  10. boundsCache: new WeakMap([]),
  11. create(props) {
  12. return {
  13. id: uuid(),
  14. type: ShapeType.Ray,
  15. isGenerated: false,
  16. name: 'Ray',
  17. parentId: 'page0',
  18. childIndex: 0,
  19. point: [0, 0],
  20. direction: [0, 1],
  21. rotation: 0,
  22. isAspectRatioLocked: false,
  23. isLocked: false,
  24. isHidden: false,
  25. style: {
  26. fill: '#c6cacb',
  27. stroke: '#000',
  28. strokeWidth: 1,
  29. },
  30. ...props,
  31. }
  32. },
  33. render({ id, direction }) {
  34. const [x2, y2] = vec.add([0, 0], vec.mul(direction, 10000))
  35. return (
  36. <g id={id}>
  37. <ThinLine x1={0} y1={0} x2={x2} y2={y2} />
  38. <DotCircle cx={0} cy={0} r={3} />
  39. </g>
  40. )
  41. },
  42. applyStyles(shape, style) {
  43. Object.assign(shape.style, style)
  44. return this
  45. },
  46. getRotatedBounds(shape) {
  47. return this.getBounds(shape)
  48. },
  49. getBounds(shape) {
  50. if (!this.boundsCache.has(shape)) {
  51. const bounds = {
  52. minX: 0,
  53. maxX: 1,
  54. minY: 0,
  55. maxY: 1,
  56. width: 1,
  57. height: 1,
  58. }
  59. this.boundsCache.set(shape, bounds)
  60. }
  61. return translateBounds(this.boundsCache.get(shape), shape.point)
  62. },
  63. getCenter(shape) {
  64. return shape.point
  65. },
  66. hitTest(shape, test) {
  67. return true
  68. },
  69. hitTestBounds(this, shape, brushBounds) {
  70. const shapeBounds = this.getBounds(shape)
  71. return (
  72. boundsContained(shapeBounds, brushBounds) ||
  73. intersectCircleBounds(shape.point, 4, brushBounds).length > 0
  74. )
  75. },
  76. rotateTo(shape) {
  77. return this
  78. },
  79. translateTo(shape, point) {
  80. shape.point = vec.toPrecision(point)
  81. return this
  82. },
  83. transform(shape, bounds) {
  84. shape.point = [bounds.minX, bounds.minY]
  85. return this
  86. },
  87. transformSingle(shape, bounds, info) {
  88. return this.transform(shape, bounds, info)
  89. },
  90. setProperty(shape, prop, value) {
  91. shape[prop] = value
  92. return this
  93. },
  94. canTransform: false,
  95. canChangeAspectRatio: false,
  96. canStyleFill: false,
  97. })
  98. export default ray