@inweb/client 25.2.2

package/src/Viewer/Markup/Impl/Konva/MarkupColor.ts

@@ -0,0 +1,39 @@
+export class MarkupColor {
+  public R: number;
+  public G: number;
+  public B: number;
+
+  private _hex: string;
+
+  /**
+   * Color in #000000 format
+   */
+  get HexColor(): string {
+    return "#" + this._hex;
+  }
+
+  get RGB(): { r: number; g: number; b: number } {
+    return { r: this.R, g: this.G, b: this.B };
+  }
+
+  constructor(r: number, g: number, b: number) {
+    this.setColor(r, g, b);
+  }
+
+  public setColor(r: number, g: number, b: number): void {
+    this.R = r;
+    this.G = g;
+    this.B = b;
+
+    this._hex = this.rgbToHex(r, g, b);
+  }
+
+  private rgbToHex(r: number, g: number, b: number): string {
+    const valueToHex = (c) => {
+      const hex = c.toString(16);
+      return hex === "0" ? "00" : hex;
+    };
+
+    return valueToHex(r) + valueToHex(g) + valueToHex(b);
+  }
+}

package/src/Viewer/Markup/Impl/Visualize/VisualizeMarkup.ts

@@ -0,0 +1,273 @@
+import { IMarkup, MarkupMode } from "../../IMarkup";
+import { Viewer } from "../../../Viewer";
+import { OdBaseDragger } from "../../../Draggers/Common/OdBaseDragger";
+import { MARKUP_ENTITY_LINE, OdaLineDragger } from "../../../Draggers/OdaLineDragger";
+import { MARKUP_ENTITY_TEXT, OdaTextDragger } from "../../../Draggers/OdaTextDragger";
+import { IMarkupObject } from "../../Api/IMarkupObject";
+
+export class VisualizeMarkup implements IMarkup {
+  private _viewer: Viewer;
+  protected _markupColor = { r: 255, g: 0, b: 0 };
+
+  public lineWidth = 0;
+
+  initialize(viewer: Viewer, canvas: HTMLCanvasElement, canvasEvents: string[]): void {
+    this._viewer = viewer;
+  }
+
+  dispose(): void {}
+
+  getDraggers(): Map<string, typeof OdBaseDragger> {
+    return new Map<string, typeof OdBaseDragger>([
+      [MarkupMode.Line, OdaLineDragger],
+      [MarkupMode.Text, OdaTextDragger],
+    ]);
+  }
+
+  clearOverlay(): void {
+    if (!this._viewer.visualizeJs) return;
+
+    const visViewer = this._viewer.visViewer();
+    const model = visViewer.getMarkupModel();
+    model.clearEntities();
+    model.delete();
+
+    this._viewer.update();
+  }
+
+  getMarkupColor(): { r: number; g: number; b: number } {
+    return this._markupColor;
+  }
+
+  setMarkupColor(r: number, g: number, b: number): void {
+    const color = { r, g, b };
+    this._markupColor = color;
+  }
+
+  colorizeAllMarkup(r = 255, g = 0, b = 0): void {
+    if (!this._viewer.visualizeJs) return;
+
+    const visViewer = this._viewer.visViewer();
+    const model = visViewer.getMarkupModel();
+    const itr = model.getEntitiesIterator();
+    for (; !itr.done(); itr.step()) {
+      const entityId = itr.getEntity();
+      const entityPtr = entityId.openObject();
+      const entityName = entityPtr.getName();
+
+      if (entityName === MARKUP_ENTITY_LINE || entityName === MARKUP_ENTITY_TEXT) {
+        entityPtr.setColor(r, g, b);
+      }
+
+      entityPtr.delete();
+    }
+    itr.delete();
+
+    this._viewer.update();
+  }
+
+  drawViewpoint(viewpoint: any): void {
+    function getLogicalPoint3dAsArray(point3d) {
+      return [point3d.x, point3d.y, point3d.z];
+    }
+
+    function getPoint3d(module, gePoint) {
+      return module.Point3d.createFromArray(gePoint);
+    }
+
+    if (!this._viewer.visualizeJs) return;
+
+    const visLib = this._viewer.visLib();
+    const visViewer = visLib.getViewer();
+    const activeView = visViewer.activeView;
+
+    this._viewer.resetActiveDragger();
+    this._viewer.clearSlices();
+    this.clearOverlay();
+
+    if (viewpoint.orthogonal_camera) {
+      activeView.setView(
+        getLogicalPoint3dAsArray(viewpoint.orthogonal_camera.view_point),
+        getLogicalPoint3dAsArray(viewpoint.orthogonal_camera.direction),
+        getLogicalPoint3dAsArray(viewpoint.orthogonal_camera.up_vector),
+        viewpoint.orthogonal_camera.field_width,
+        viewpoint.orthogonal_camera.field_height,
+        true
+      );
+    }
+
+    this._viewer.syncOverlay();
+
+    const markupColor = viewpoint.custom_fields.markup_color || { r: 255, g: 0, b: 0 };
+    this.setMarkupColor(markupColor.r, markupColor.g, markupColor.b);
+
+    if (viewpoint.lines) {
+      for (const line of viewpoint.lines) {
+        const entityId = this._viewer.addMarkupEntity(MARKUP_ENTITY_LINE);
+        const entityPtr = entityId.openObject();
+
+        const entityData = [];
+        for (const point of line.points) {
+          entityData.push(point.x, point.y, point.z);
+        }
+        const geomData = entityPtr.appendPolyline(entityData);
+
+        geomData.delete();
+        entityPtr.delete();
+      }
+    }
+
+    if (viewpoint.texts) {
+      const pos = getPoint3d(visLib, activeView.viewPosition);
+      const target = getPoint3d(visLib, activeView.viewTarget);
+      const normal = pos.sub(target).asVector();
+
+      for (const text of viewpoint.texts) {
+        const entityId = this._viewer.addMarkupEntity(MARKUP_ENTITY_TEXT);
+        const entityPtr = entityId.openObject();
+
+        const geomData = entityPtr.appendText(getLogicalPoint3dAsArray(text.position), text.text);
+
+        const textPtr = geomData.openAsText();
+        textPtr.setNormal(getLogicalPoint3dAsArray(normal));
+        textPtr.setRotation(text.angle);
+        textPtr.setTextSize(text.text_size);
+
+        textPtr.delete();
+        geomData.delete();
+        entityPtr.delete();
+      }
+    }
+
+    if (viewpoint.clipping_planes) {
+      for (const plane of viewpoint.clipping_planes) {
+        const cuttingPlane = new visLib.OdTvPlane();
+        cuttingPlane.set(getLogicalPoint3dAsArray(plane.location), getLogicalPoint3dAsArray(plane.direction));
+
+        activeView.addCuttingPlane(cuttingPlane);
+        activeView.setEnableCuttingPlaneFill(true, 0x66, 0x66, 0x66);
+      }
+    }
+
+    this._viewer.update();
+  }
+
+  createViewpoint(): object {
+    function getLogicalPoint3dFromArray(array) {
+      return { x: array[0], y: array[1], z: array[2] };
+    }
+
+    if (!this._viewer.visualizeJs) return {};
+
+    const visLib = this._viewer.visLib();
+    const visViewer = visLib.getViewer();
+    const activeView = visViewer.activeView;
+
+    const viewpoint = {
+      lines: [],
+      texts: [],
+      clipping_planes: [],
+    } as any;
+
+    viewpoint.orthogonal_camera = {
+      view_point: getLogicalPoint3dFromArray(activeView.viewPosition),
+      direction: getLogicalPoint3dFromArray(activeView.viewTarget),
+      up_vector: getLogicalPoint3dFromArray(activeView.upVector),
+      field_width: activeView.viewFieldWidth,
+      field_height: activeView.viewFieldHeight,
+    };
+
+    const model = visViewer.getMarkupModel();
+    const itr = model.getEntitiesIterator();
+    for (; !itr.done(); itr.step()) {
+      const entityId = itr.getEntity();
+      const entityPtr = entityId.openObject();
+      const entityName = entityPtr.getName();
+
+      const geomItr = entityPtr.getGeometryDataIterator();
+      if (geomItr.done()) {
+        entityPtr.delete();
+        continue;
+      }
+
+      const geometryId = geomItr.getGeometryData();
+
+      if (entityName === MARKUP_ENTITY_LINE) {
+        const polylinePtr = geometryId.openAsPolyline();
+        const points = polylinePtr.getPoints();
+
+        const line = {
+          points: [],
+        };
+        for (const point of points) {
+          line.points.push(getLogicalPoint3dFromArray(point));
+        }
+
+        viewpoint.lines.push(line);
+        polylinePtr.delete();
+      } else if (entityName === MARKUP_ENTITY_TEXT) {
+        const textPtr = geometryId.openAsText();
+        const position = textPtr.getPosition();
+
+        const text = {
+          position: getLogicalPoint3dFromArray(position),
+          text: textPtr.getString(),
+          angle: textPtr.getRotation(),
+          text_size: textPtr.getTextSize(),
+        };
+
+        viewpoint.texts.push(text);
+        textPtr.delete();
+      }
+
+      entityPtr.delete();
+    }
+    itr.delete();
+
+    for (let i = 0; i < activeView.numCuttingPlanes(); i++) {
+      const cuttingPlane = activeView.getCuttingPlane(i);
+
+      const plane = {
+        location: getLogicalPoint3dFromArray(cuttingPlane.getOrigin()),
+        direction: getLogicalPoint3dFromArray(cuttingPlane.normal()),
+      };
+
+      viewpoint.clipping_planes.push(plane);
+    }
+
+    viewpoint.snapshot = {
+      data: visLib.canvas.toDataURL("image/jpeg", 0.25),
+    };
+
+    viewpoint.custom_fields = {
+      markup_color: this.getMarkupColor(),
+    };
+
+    viewpoint.description = new Date().toDateString();
+    return viewpoint;
+  }
+
+  getLayer(): any {
+    throw new Error("Not implemented yet");
+  }
+
+  createObject(type: string, params: any): IMarkupObject {
+    throw new Error("Not implemented yet");
+  }
+
+  getObjects(): IMarkupObject[] {
+    throw new Error("Not implemented yet");
+  }
+
+  getSelectedObjects(): IMarkupObject[] {
+    throw new Error("Not implemented yet");
+  }
+
+  selectObjects(objects: IMarkupObject[]): void {
+    throw new Error("Not implemented yet");
+  }
+
+  clearSelected(): void {
+    throw new Error("Not implemented yet");
+  }
+}

package/src/Viewer/Markup/MarkupFactory.ts

@@ -0,0 +1,32 @@
+import { IMarkup, MarkupType } from "./IMarkup";
+import { KonvaMarkup } from "./Impl/Konva/KonvaMarkup";
+import { VisualizeMarkup } from "./Impl/Visualize/VisualizeMarkup";
+
+export class MarkupFactory {
+  public static createMarkup(markupType: MarkupType): IMarkup {
+    let markup;
+    switch (markupType) {
+      case MarkupType.Konva:
+        markup = this.createKonva();
+        break;
+
+      case MarkupType.Visualize:
+        markup = this.createVisualize();
+        break;
+
+      default:
+        throw new Error("Error during Markup Initialization. Markup Type is unknown.");
+        break;
+    }
+
+    return markup;
+  }
+
+  private static createKonva(): IMarkup {
+    return new KonvaMarkup();
+  }
+
+  private static createVisualize(): IMarkup {
+    return new VisualizeMarkup();
+  }
+}