import { THREE } from "@x-viewer/core"; import { type BaseViewer, BoxSelectHelper, PickMarkupHelper, Plugin, PluginConfig } from "@x-viewer/core"; /** * Screenshot mode. */ export declare enum ScreenshotMode { /** * Take screenshot of the whole canvas. */ Default = "Default", /** * Take screenshot by box selecting an area. */ BoxSelection = "BoxSelection", /** * Take screenshot by picking a markup. */ PickMarkup = "PickMarkup" } /** * Screenshot plugin config. */ export interface ScreenshotPluginConfig extends Partial { /** * Image type. */ type?: "image/png" | "image/jpg"; /** * Image quality. */ quality?: number; /** * Sets background transparent, this must be used for "image/png" format. * @default false * @hidden */ setBackgroundTransparent?: boolean; } /** * Screenshot result, which contains a result image and, * for Viewer2d, it also contains the view extent when the screenshot is taken, * for Viewer3d, it contains the camera's position and target. */ export interface ScreenshotResult { /** * The view extent when the screenshot is taken. * Note that, it is not the image's extent. * And, this is for Viewer2d only. */ viewExtent?: THREE.Box2; /** * Used for Viewer3d * @hidden */ /** * Used for Viewer3d * @hidden */ /** * Image type, which is "image/png" by default * @hidden */ imageType: string; /** * The image, in base 64 format. */ base64Image: string; } /** * Screenshot plugin */ export declare class ScreenshotPlugin extends Plugin { static readonly DEFAULT_ID = "ScreenshotPlugin"; protected cfg: ScreenshotPluginConfig; protected boxSelectHelper?: BoxSelectHelper; protected pickMarkupHelper?: PickMarkupHelper; protected originalBackground: THREE.Color | undefined; protected originalClearAlpha: number; constructor(viewer: BaseViewer, cfg?: ScreenshotPluginConfig); /** * Captures the WebGL canvas as a data URL (base64 image string). * @example * ``` typescript * const plugin = new ScreenshotPlugin(viewer); * const base64Image = plugin.getScreenshot(); * console.log(base64Image); * ``` */ getScreenshot(): string | undefined; /** * Gets screenshot by bbox under screen cooridinate. */ getScreenshotByScreenBBox(bbox: THREE.Box2): Promise; /** * Gets a screenshot for world-space bounds clipped to the current viewport (screen overlap only). * It needs to convert world to screen coordinate, in order to get the * screenshot range. Assume it maps to bboxA under screen coordinate, * and current view boundary is bboxB (e.g., 0,0 - 1024,768). * Since, a given world coordinate may not be in current view boundary. * The finally screenshot is the overlap of bboxA and bboxB. When * - bboxA includes bboxB, it get screenshot for bboxB * - bboxB includes bboxA, it get screenshot for bboxA * - bboxA overlaps with bboxB, it get screenshot for the overlapped area * - bboxA doesn't overlap with bboxB, it get nothing * * A best practice to use this API is to use orthographic camera, under top view, * and pass in viewer's bbox. */ getScreenshotForWorldBoundsInViewport(bbox: THREE.Box3): Promise; /** * Async screenshot: full view, user box selection, or pick-a-markup region; returns base64 image data. * @param mode `Default` (full view), `BoxSelection`, or `PickMarkup`. * @example * ``` typescript * // Pick a markup to define the crop region. * const mode = ScreenshotMode.PickMarkup; * viewer.getScreenshot(mode).then(data => console.log(data)); * // User draws a rectangle on screen. * const mode = ScreenshotMode.BoxSelection; * viewer.getScreenshot(mode).then(data => console.log(data)); * // Entire current view. * const mode = ScreenshotMode.Default; * const plugin = new ScreenshotPlugin(viewer); * plugin.getScreenshotAsync(mode).then(data => console.log(data)); * ``` */ getScreenshotAsync(mode?: ScreenshotMode): Promise; /** * If ScreenshotPlugin is active. */ isActive(): (() => boolean) | undefined; /** * Cancel current operation if any. */ cancel(): void; }