Renderer Namespace

Usage of the SDK constitutes your agreement with the Matterport SDK Agreement. Email developers@matterport.com with any questions.

Index

Types

Resolution

Resolution: object

Type declaration

  • height: number
  • width: number

Visibility

Visibility: object

Type declaration

  • mattertags: boolean
  • measurements: boolean
  • sweeps: boolean
  • views: boolean

WorldPositionData

WorldPositionData: object

Type declaration

  • floor: number
  • floorInfo: object
    • id: string
    • sequence: number
  • position: Vector3 | null

Methods

getScreenPosition

getWorldPositionData

  • Converts a screen position into a world position

    If the height is not passed in, the function returns the first raycast hit in the direction of that screen position. However, if there is no intersection with the model in that direction, the position will be null and the floor will be -1.

    const screenPosition {x: 0, y: 0}; // Top left corner of the screen
    
    mpSdk.Renderer.getWorldPositionData(screenPosition)
    .then(function(data){
       const worldPosition = data.position; // e.g. {x: 2.2323231, y: 4.7523232, z; 7.92893};
       const floor = data.floor; // e.g. 2
    });
    

    If the height is passed in, the function returns the intersection with the plane at that height. However, if there is no intersection with the plane in that direction, the position will be null and the floor will be -1.

    const screenPosition {x: 0, y: 0}; // Top left corner of the screen
    const height = 20;
    
    mpSdk.Renderer.getWorldPositionData(screenPosition, height)
    .then(function(data){
       const worldPosition = data.position; // e.g. {x: 2.2323231, y: 20, z; 7.92893};
       const floor = data.floor // e.g. 2
    });
    

    Parameters

    • screenPosition: Vector2

      The screen position in pixels from the top-left corner of the screen. For example, {x: 300, y: 200} would be the position 300 pixels right and 200 pixels down from the top-left corner.

    • Optional height: undefined | number
    • Optional includeHiddenFloors: undefined | false | true

    Returns Promise<Renderer.WorldPositionData>

takeEquirectangular

  • takeEquirectangular(): Promise<string>
  • Takes an equirectangular screenshot (JPEG) of the currently active sweep.

    mpSdk.Renderer.takeEquirectangular()
      .then(function (screenShotUri) {
        // set src of an img element
        img.src = screenShotUri
    });
    

    Returns Promise<string>

    A promise that resolves with the screenshot URI -- a base64 encoded string which is usable as a src of an <img> element.

    Errors

    Warns if the camera is not in Panorama mode and is instead in Dollhouse or Floorplan mode.

    Notes

    It is not on Matterport servers and does not persist between user sessions.

takeScreenShot

  • Takes a screenshot (JPEG) of the user’s current view.

    const resolution = {
      width: 600,
      height: 800
    };
    
    const visibility = {
      mattertags: false,
      sweeps: true
    };
    
    mpSdk.Renderer.takeScreenShot(resolution, visibility)
      .then(function (screenShotUri) {
        // set src of an img element
        img.src = screenShotUri
    });
    

    Parameters

    • Optional resolution: Renderer.Resolution

      The desired resolution for the screenshot. For example: {width: 1920, height: 1080} If no resolution is specified, then the resolution of the size of Showcase (the current window or the iframe embed) is used. Maximum 4096 x 4096.

    • Optional visibility: Partial<Renderer.Visibility>

      Toggles certain scene objects such as Mattertag Posts and sweep markers. If no visibility object is specified, then all scene objects are hidden.

    Returns Promise<string>

    A promise that resolves with the screenshot URI -- a base64 encoded string which is usable as a src of an <img> element.

    Errors

    Warns if the resolution is 0 or negative.