Home Reference Source Repository 
import View from 'awv3-next/core/view.js'
public class | source

View

A view represents a portion of canvas on which webGL can draw. The view is defined and tracked by a dom node on which the drawing take place.

Constructor Summary

Public Constructor
public

constructor(canvas: Object, options: Object): Object

Construct a new View

Member Summary

Public Members
public

ambient: *

public
public

aspect: *

public
public

bottom: *

public

bounds: *

public
public
public
public

camera: *

public
public

canvas: *

public
public
public

cursor: *

public
public
public

dom: *

public
public

height: *

public
public

id: *

public

input: *

public
public
public

left: *

public

new: *

public

old: *

public

opacity: *

public
public
public

scene: *

public
public set
public

stats: *

public

top: *

public

visible: *

public

width: *

Method Summary

Public Methods
public

calibrate(width: *, height: *)

public

clear(time: *): *

public

getPoint2(point3: THREE.Vector3): THREE.Vector2

Projects 2-dimensional coordinate from a 3-dimensional point within the view's scene.
public

getPoint3(point2: *): *

public

getViewLine3(point2: *): *

public

invalidate(frames: number): *

public

measure(): *

public

render(time: *)

public

setCursor(style: String, fallback: String): *

Sets the cursor style.
public

updateBounds(box: *): *

public
public

Public Constructors

public constructor(canvas: Object, options: Object): Object source

Construct a new View

Params:

NameTypeAttributeDescription
canvas Object
  • optional
  • default: lastCreated

The parent canvas, if none defined the lastCreated will be used
options Object
  • optional
  • default: {}

Options to initialize the View with
options.dom HTMLElement
  • optional
  • default: canvas.dom

The HTML element on which the view will draw
options.renderAlways Boolean
  • optional
  • default: false

Set to true the view will render 60fps, set to false it will render on changes (default, recommended)
options.visible Boolean
  • optional
  • default: true

Set to true the view will render
options.callbackBefore Function
  • optional
  • default: undefined

Callback before the render pass
options.callbackRender Function
  • optional
  • default: undefined

Callback to custom-render the scene
options.callbackAfter Function
  • optional
  • default: undefined

Callback after the render pass
options.background Number
  • optional
  • default: canvas.renderer.clearColor

Background color
options.opacity Number
  • optional
  • default: 0.0

Background opacity
options.ambientColor Number
  • optional
  • default: 0xffffff

Ambient color
options.ambientIntensity Number
  • optional
  • default: 1.0

Ambient intensity

Return:

Object

The constructed View

Example:

import View from 'view';
// Create a view, defaults into the same dom as the canvas
const view = new View(canvas, { dom: '#view', ambient: 0x909090 });
// Add model to the view's scene
view.scene.add(model);

Public Members

public ambient: * source

public ambientHud: * source

public aspect: * source

public background: * source

public bottom: * source

public bounds: * source

public callbackAfter: * source

public callbackBefore: * source

public callbackRender: * source

public camera: * source

public cameraHud: * source

public canvas: * source

public controls: * source

public controlsHud: * source

public cursor: * source

public defaultCursor: * source

public dirty: boolean source

public dom: * source

public force: number source

public height: * source

public hud: boolean source

public id: * source

public input: * source

public interaction: * source

public invalidateFrames: number source

public left: * source

public new: * source

public old: * source

public opacity: * source

public renderAlways: * source

public renderer: * source

public scene: * source

public sceneHud: * source

public set showStats: * source

public stats: * source

public top: * source

public visible: * source

public width: * source

Public Methods

public calibrate(width: *, height: *) source

Params:

NameTypeAttributeDescription
width *
height *

public clear(time: *): * source

Params:

NameTypeAttributeDescription
time *

Return:

*

public getPoint2(point3: THREE.Vector3): THREE.Vector2 source

Projects 2-dimensional coordinate from a 3-dimensional point within the view's scene.

Params:

NameTypeAttributeDescription
point3 THREE.Vector3

Input point

Return:

THREE.Vector2

The projected point

Example:

// Grab x and y off THREE's projected Vector2
let {x, y} = view.getPoint2D(new THREE.Vector3(10, 20, 100));

public getPoint3(point2: *): * source

Params:

NameTypeAttributeDescription
point2 *

Return:

*

public getViewLine3(point2: *): * source

Params:

NameTypeAttributeDescription
point2 *

Return:

*

public invalidate(frames: number): * source

Params:

NameTypeAttributeDescription
frames number
  • optional
  • default: 1

Return:

*

public measure(): * source

Return:

*

public render(time: *) source

Params:

NameTypeAttributeDescription
time *

public setCursor(style: String, fallback: String): * source

Sets the cursor style. Applies when the mouse is inside the view's rect.

Params:

NameTypeAttributeDescription
style String
  • default: 'auto'

CSS cursor style
fallback String
  • optional

Fallback style, should the target style not be available

Return:

*

Example:

// 'grab' is available in WebKit and Blink only
view.setCursor('grab', 'move');

public updateBounds(box: *): * source

Params:

NameTypeAttributeDescription
box *
  • optional
  • default: undefined

Return:

*

public updateOverlays() source

public updateScopes() source