@inweb/markup 25.8.0 → 25.8.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -29,6 +29,29 @@ class MarkupColor {
29
29
  }
30
30
  }
31
31
 
32
+ class WorldTransform {
33
+ screenToWorld(position) {
34
+ return {
35
+ x: position.x,
36
+ y: position.y,
37
+ z: 0
38
+ };
39
+ }
40
+ worldToScreen(position) {
41
+ return {
42
+ x: position.x,
43
+ y: position.y
44
+ };
45
+ }
46
+ getScale() {
47
+ return {
48
+ x: 1,
49
+ y: 1,
50
+ z: 1
51
+ };
52
+ }
53
+ }
54
+
32
55
  const LineTypeSpecs = new Map([ [ "solid", [] ], [ "dot", [ 30, 30, .001, 30 ] ], [ "dash", [ 30, 30 ] ] ]);
33
56
 
34
57
  class KonvaLine {
@@ -939,7 +962,7 @@ class KonvaMarkup {
939
962
  initialize(container, pointerEvents, viewer, worldTransformer) {
940
963
  if (!Konva) throw new Error('Markup: Error during initialization. Konva is not initialized. Update node_modules or add to your page <script src="https://unpkg.com/konva@9/konva.min.js"><\/script>');
941
964
  this._viewer = viewer;
942
- this._worldTransformer = worldTransformer;
965
+ this._worldTransformer = worldTransformer !== null && worldTransformer !== void 0 ? worldTransformer : new WorldTransform;
943
966
  this._container = container;
944
967
  this._pointerEvents = pointerEvents !== null && pointerEvents !== void 0 ? pointerEvents : [];
945
968
  this._markupContainer = document.createElement("div");
@@ -1078,13 +1101,6 @@ class KonvaMarkup {
1078
1101
  clearSelected() {
1079
1102
  this._konvaTransformer.nodes([]);
1080
1103
  }
1081
- getPoint3dFromArray(array) {
1082
- return {
1083
- x: array[0],
1084
- y: array[1],
1085
- z: array[2]
1086
- };
1087
- }
1088
1104
  fillViewpointShapes(viewpoint) {
1089
1105
  const markupLines = this.getMarkupLines();
1090
1106
  if (markupLines && markupLines.length > 0) {
@@ -1375,7 +1391,7 @@ class KonvaMarkup {
1375
1391
  const konvaLine = new KonvaLine(null, line);
1376
1392
  lines.push({
1377
1393
  id: konvaLine.id(),
1378
- points: worldPoints.map((p => this.getPoint3dFromArray(p))),
1394
+ points: worldPoints,
1379
1395
  color: konvaLine.getColor() || "#ff0000",
1380
1396
  type: konvaLine.getLineType() || this.lineType,
1381
1397
  width: konvaLine.getLineWidth() || this.lineWidth
@@ -1389,14 +1405,15 @@ class KonvaMarkup {
1389
1405
  const textScale = this._worldTransformer.getScale();
1390
1406
  this.konvaLayerFind("Text").forEach((text => {
1391
1407
  if (!text) return;
1392
- const position = this._worldTransformer.screenToWorld({
1408
+ const position = {
1393
1409
  x: text.x(),
1394
1410
  y: text.y()
1395
- });
1411
+ };
1412
+ const worldPoint = this._worldTransformer.screenToWorld(position);
1396
1413
  const shape = new KonvaText(null, text);
1397
1414
  texts.push({
1398
1415
  id: shape.id(),
1399
- position: this.getPoint3dFromArray(position),
1416
+ position: worldPoint,
1400
1417
  text: shape.getText(),
1401
1418
  text_size: textSize * textScale.y,
1402
1419
  angle: shape.getRotation(),
@@ -1414,7 +1431,7 @@ class KonvaMarkup {
1414
1431
  const shape = new KonvaRectangle(null, rect);
1415
1432
  rectangles.push({
1416
1433
  id: shape.id(),
1417
- position: this.getPoint3dFromArray(worldPoint),
1434
+ position: worldPoint,
1418
1435
  width: shape.getWidth(),
1419
1436
  height: shape.getHeigth(),
1420
1437
  line_width: shape.getLineWidth(),
@@ -1431,7 +1448,7 @@ class KonvaMarkup {
1431
1448
  const shape = new KonvaEllipse(null, ellipse);
1432
1449
  ellipses.push({
1433
1450
  id: shape.id(),
1434
- position: this.getPoint3dFromArray(worldPoint),
1451
+ position: worldPoint,
1435
1452
  radius: {
1436
1453
  x: ellipse.getRadiusX(),
1437
1454
  y: ellipse.getRadiusY()
@@ -1459,8 +1476,8 @@ class KonvaMarkup {
1459
1476
  const shape = new KonvaArrow(null, arrow);
1460
1477
  arrows.push({
1461
1478
  id: shape.id(),
1462
- start: this.getPoint3dFromArray(worldStartPoint),
1463
- end: this.getPoint3dFromArray(worldEndPoint),
1479
+ start: worldStartPoint,
1480
+ end: worldEndPoint,
1464
1481
  color: shape.getColor()
1465
1482
  });
1466
1483
  }));
@@ -1474,7 +1491,7 @@ class KonvaMarkup {
1474
1491
  const shape = new KonvaImage(null, image);
1475
1492
  images.push({
1476
1493
  id: shape.id(),
1477
- position: this.getPoint3dFromArray(worldPoint),
1494
+ position: worldPoint,
1478
1495
  src: shape.getSrc(),
1479
1496
  width: shape.getWidth(),
1480
1497
  height: shape.getHeight()
@@ -1490,7 +1507,7 @@ class KonvaMarkup {
1490
1507
  const shape = new KonvaCloud(null, cloud);
1491
1508
  clouds.push({
1492
1509
  id: shape.id(),
1493
- position: this.getPoint3dFromArray(worldPoint),
1510
+ position: worldPoint,
1494
1511
  width: shape.getWidth(),
1495
1512
  height: shape.getHeigth(),
1496
1513
  line_width: shape.getLineWidth(),