Nutrient Web SDK
    Preparing search index...

    Class CustomOverlayItem

    This record is used to persist the information for a Custom Overlay Item.

    Custom Overlay Items are user defined DOM Nodes that are rendered in a page at a given position.

    Creating an image and rendering it as Custom Overlay Item.

    let img = document.createElement("img");
    img.src = "https://example.com/logo.png";

    const item = new NutrientViewer.CustomOverlayItem({
    id: "logo-item",
    node: img,
    pageIndex: 0,
    position: new NutrientViewer.Geometry.Point({ x: 100, y: 100 }),
    onAppear() {
    console.log('rendered!');
    }
    });

    instance.setCustomOverlayItem(item);

    Hierarchy

    • Record<
          {
              disableAutoZoom?: boolean;
              id: null
              | string;
              node: null | Node;
              noRotate?: boolean;
              onAppear?: null | ((...args: unknown[]) => void);
              onDisappear?: null | ((...args: unknown[]) => void);
              pageIndex: number;
              position: NutrientViewer.Geometry.Point;
          },
          this,
      > & Readonly<
          {
              disableAutoZoom?: boolean;
              id: null
              | string;
              node: null | Node;
              noRotate?: boolean;
              onAppear?: null | ((...args: unknown[]) => void);
              onDisappear?: null | ((...args: unknown[]) => void);
              pageIndex: number;
              position: NutrientViewer.Geometry.Point;
          },
      >
      • CustomOverlayItem
    Index

    Constructors

    • Parameters

      • args: {
            disableAutoZoom?: boolean;
            id: null | string;
            node: null | Node;
            noRotate?: boolean;
            onAppear?: null | ((...args: unknown[]) => void);
            onDisappear?: null | ((...args: unknown[]) => void);
            pageIndex: number;
            position: NutrientViewer.Geometry.Point;
        }

      Returns NutrientViewer.CustomOverlayItem

    Properties

    disableAutoZoom: boolean

    Whether the node should not be zoomed (scaled) with the page.

    Custom zoom handling makes sense when you want to display rasterized images for example, and you need to manually re-render them (maybe when using <canvas> images or want to display images at different resolutions).

    To track zoom changes and manually update overlay items you can subscribe to the viewState.zoom.change event.

    By default items will zoom with the page using a CSS based scale transformation.

    false
    
    id: string

    A unique identifier to describe the custom overlay item. New IDs should be generated by the user and should be unique.

    node: Node

    A reference to the DOM Node to render in the page.

    noRotate: boolean

    Whether the node should not be rotated with the page.

    onAppear?: null | ((...args: unknown[]) => void)

    Optional callback to invoke when the custom item is created and appears in the viewport.

    onDisappear?: null | ((...args: unknown[]) => void)

    Optional callback to invoke when the custom item is removed.

    pageIndex: number

    The page index on which the custom item is placed. It's important to notice that a custom item can only ever be on one page.

    Position of this custom item in the page. The coordinates are in the PDF page space with the origin being on the top left.

    Methods

    • Returns IterableIterator<
          [
              keyof {
                  disableAutoZoom?: boolean;
                  id: null
                  | string;
                  node: null | Node;
                  noRotate?: boolean;
                  onAppear?: null | ((...args: unknown[]) => void);
                  onDisappear?: null | ((...args: unknown[]) => void);
                  pageIndex: number;
                  position: NutrientViewer.Geometry.Point;
              },
              | undefined
              | null
              | string
              | number
              | boolean
              | Node
              | NutrientViewer.Geometry.Point
              | ((...args: unknown[]) => void)
              | ((...args: unknown[]) => void),
          ],
      >

    • Returns this

      Map#asImmutable

    • Returns this

      Map#asMutable

    • Returns a new instance of this Record type with all values set to their default values.

      Returns this

    • Returns a new instance of this Record type with the value for the specific key set to its default value.

      Type Parameters

      • K extends keyof {
            disableAutoZoom?: boolean;
            id: null | string;
            node: null | Node;
            noRotate?: boolean;
            onAppear?: null | ((...args: unknown[]) => void);
            onDisappear?: null | ((...args: unknown[]) => void);
            pageIndex: number;
            position: NutrientViewer.Geometry.Point;
        }

      Parameters

      • key: K

      Returns this

      remove

    • Parameters

      Returns this

      removeIn

    • Parameters

      • other: any

      Returns boolean

    • Returns the value associated with the provided key, which may be the default value defined when creating the Record factory function.

      If the requested key is not defined by this Record type, then notSetValue will be returned if provided. Note that this scenario would produce an error when using Flow or TypeScript.

      Type Parameters

      • K extends keyof {
            disableAutoZoom?: boolean;
            id: null | string;
            node: null | Node;
            noRotate?: boolean;
            onAppear?: null | ((...args: unknown[]) => void);
            onDisappear?: null | ((...args: unknown[]) => void);
            pageIndex: number;
            position: NutrientViewer.Geometry.Point;
        }

      Parameters

      • key: K
      • OptionalnotSetValue: any

      Returns {
          disableAutoZoom?: boolean;
          id: null | string;
          node: null | Node;
          noRotate?: boolean;
          onAppear?: null | ((...args: unknown[]) => void);
          onDisappear?: null | ((...args: unknown[]) => void);
          pageIndex: number;
          position: NutrientViewer.Geometry.Point;
      }[K]

    • Type Parameters

      • T

      Parameters

      • key: string
      • notSetValue: T

      Returns T

    • Parameters

      Returns any

    • Parameters

      • key: string

      Returns key is
          | "id"
          | "pageIndex"
          | "noRotate"
          | "disableAutoZoom"
          | "node"
          | "position"
          | "onAppear"
          | "onDisappear"

    • Returns number

    • Parameters

      Returns boolean

    • Parameters

      • ...collections: (
            | Iterable<[string, any]>
            | Partial<
                {
                    disableAutoZoom?: boolean;
                    id: null
                    | string;
                    node: null | Node;
                    noRotate?: boolean;
                    onAppear?: null | ((...args: unknown[]) => void);
                    onDisappear?: null | ((...args: unknown[]) => void);
                    pageIndex: number;
                    position: NutrientViewer.Geometry.Point;
                },
            >
        )[]

      Returns this

    • Parameters

      • ...collections: (
            | Iterable<[string, any]>
            | Partial<
                {
                    disableAutoZoom?: boolean;
                    id: null
                    | string;
                    node: null | Node;
                    noRotate?: boolean;
                    onAppear?: null | ((...args: unknown[]) => void);
                    onDisappear?: null | ((...args: unknown[]) => void);
                    pageIndex: number;
                    position: NutrientViewer.Geometry.Point;
                },
            >
        )[]

      Returns this

    • Parameters

      • keyPath: Iterable<any>
      • ...collections: any[]

      Returns this

    • Parameters

      • merger: (oldVal: any, newVal: any, key: any) => any
      • ...collections: (
            | Iterable<[string, any]>
            | Partial<
                {
                    disableAutoZoom?: boolean;
                    id: null
                    | string;
                    node: null | Node;
                    noRotate?: boolean;
                    onAppear?: null | ((...args: unknown[]) => void);
                    onDisappear?: null | ((...args: unknown[]) => void);
                    pageIndex: number;
                    position: NutrientViewer.Geometry.Point;
                },
            >
        )[]

      Returns this

    • Parameters

      • keyPath: Iterable<any>
      • ...collections: any[]

      Returns this

    • Parameters

      • merger: (
            oldVal: any,
            newVal: any,
            key: keyof {
                disableAutoZoom?: boolean;
                id: null | string;
                node: null | Node;
                noRotate?: boolean;
                onAppear?: null | ((...args: unknown[]) => void);
                onDisappear?: null | ((...args: unknown[]) => void);
                pageIndex: number;
                position: NutrientViewer.Geometry.Point;
            },
        ) => any
      • ...collections: (
            | Iterable<[string, any]>
            | Partial<
                {
                    disableAutoZoom?: boolean;
                    id: null
                    | string;
                    node: null | Node;
                    noRotate?: boolean;
                    onAppear?: null | ((...args: unknown[]) => void);
                    onDisappear?: null | ((...args: unknown[]) => void);
                    pageIndex: number;
                    position: NutrientViewer.Geometry.Point;
                },
            >
        )[]

      Returns this

    • Type Parameters

      • K extends keyof {
            disableAutoZoom?: boolean;
            id: null | string;
            node: null | Node;
            noRotate?: boolean;
            onAppear?: null | ((...args: unknown[]) => void);
            onDisappear?: null | ((...args: unknown[]) => void);
            pageIndex: number;
            position: NutrientViewer.Geometry.Point;
        }

      Parameters

      • key: K

      Returns this

    • Parameters

      Returns this

    • Type Parameters

      • K extends keyof {
            disableAutoZoom?: boolean;
            id: null | string;
            node: null | Node;
            noRotate?: boolean;
            onAppear?: null | ((...args: unknown[]) => void);
            onDisappear?: null | ((...args: unknown[]) => void);
            pageIndex: number;
            position: NutrientViewer.Geometry.Point;
        }

      Parameters

      • key: K
      • value: {
            disableAutoZoom?: boolean;
            id: null | string;
            node: null | Node;
            noRotate?: boolean;
            onAppear?: null | ((...args: unknown[]) => void);
            onDisappear?: null | ((...args: unknown[]) => void);
            pageIndex: number;
            position: NutrientViewer.Geometry.Point;
        }[K]

      Returns this

    • Parameters

      Returns this

    • Deeply converts this Record to equivalent native JavaScript Object.

      Note: This method may not be overridden. Objects with custom serialization to plain JS may override toJSON() instead.

      Returns {
          disableAutoZoom?: any;
          id: any;
          node: any;
          noRotate?: any;
          onAppear?: any;
          onDisappear?: any;
          pageIndex: any;
          position: any;
      }

    • Shallowly converts this Record to equivalent native JavaScript Object.

      Returns {
          disableAutoZoom?: boolean;
          id: null | string;
          node: null | Node;
          noRotate?: boolean;
          onAppear?: null | ((...args: unknown[]) => void);
          onDisappear?: null | ((...args: unknown[]) => void);
          pageIndex: number;
          position: NutrientViewer.Geometry.Point;
      }

    • Shallowly converts this Record to equivalent JavaScript Object.

      Returns {
          disableAutoZoom?: boolean;
          id: null | string;
          node: null | Node;
          noRotate?: boolean;
          onAppear?: null | ((...args: unknown[]) => void);
          onDisappear?: null | ((...args: unknown[]) => void);
          pageIndex: number;
          position: NutrientViewer.Geometry.Point;
      }

    • Returns Keyed<
          keyof {
              disableAutoZoom?: boolean;
              id: null
              | string;
              node: null | Node;
              noRotate?: boolean;
              onAppear?: null | ((...args: unknown[]) => void);
              onDisappear?: null | ((...args: unknown[]) => void);
              pageIndex: number;
              position: NutrientViewer.Geometry.Point;
          },
          | undefined
          | null
          | string
          | number
          | boolean
          | Node
          | NutrientViewer.Geometry.Point
          | ((...args: unknown[]) => void)
          | ((...args: unknown[]) => void),
      >

    • Type Parameters

      • K extends keyof {
            disableAutoZoom?: boolean;
            id: null | string;
            node: null | Node;
            noRotate?: boolean;
            onAppear?: null | ((...args: unknown[]) => void);
            onDisappear?: null | ((...args: unknown[]) => void);
            pageIndex: number;
            position: NutrientViewer.Geometry.Point;
        }

      Parameters

      • key: K
      • updater: (
            value: {
                disableAutoZoom?: boolean;
                id: null | string;
                node: null | Node;
                noRotate?: boolean;
                onAppear?: null | ((...args: unknown[]) => void);
                onDisappear?: null | ((...args: unknown[]) => void);
                pageIndex: number;
                position: NutrientViewer.Geometry.Point;
            }[K],
        ) => {
            disableAutoZoom?: boolean;
            id: null
            | string;
            node: null | Node;
            noRotate?: boolean;
            onAppear?: null | ((...args: unknown[]) => void);
            onDisappear?: null | ((...args: unknown[]) => void);
            pageIndex: number;
            position: NutrientViewer.Geometry.Point;
        }[K]

      Returns this

    • Parameters

      • keyPath: Iterable<any>
      • updater: (value: any) => any

      Returns this

    • Returns boolean

      Map#wasAltered

    • Note: Not all methods can be used on a mutable collection or within withMutations! Only set may be used mutatively.

      Parameters

      • mutator: (mutable: this) => any

      Returns this

      Map#withMutations