import Canvas from 'awv3-next/core/canvas.js'

public class | source

Canvas

The Canvas class holds the webGL context and maps the underlying views. It initializes it's own renderer, event system and parser.

Constructor Summary

Public Constructor
public	constructor(options: Object): Object Construct a new Canvas

Member Summary

Public Members
public	debugLevel: * Debug level for this canvas
public	dom: * The dom node in which the canvas lives
public	events: * Global events using the Events class
public	id: * GUID to help identify the canvas
public	parser: * Parser using webworkers to unpack and optimize compressed packages
public	renderer: * GL Renderer via three.js
public	scopes: * Map of managed scopes.
public	version: * awv3 version
public	views: * List of managed views

Public Constructors

public constructor(options: Object): Object source

Construct a new Canvas

Params:

Name	Type	Attribute	Description
options	Object	optional default: {}	Options to initialize the Canvas with
options.dom	HTMLElement	optional	The HTML element in which the canvas will live. If this is empty a detached div element will be created that needs to be appended to the DOM manually. This may be the best option for viewmodel driven frameworks since the state can be exported out and held separtely to the 3d-control.
options.debugLevel	Number	optional default: 0	Console debugging levels
options.resolution	Number	optional default: 1	GL Canvas rasolution
options.place	String	optional default: 'first'	Where to place the render-element, options are 'first' and 'last'
options.startImmediately	Boolean	optional default: true	If true will run a requestAnimationFrame going into a loop. If false, it can be called manually (canvas,renderer.start();)
options.clearColor	THREE.Color	optional default: new	THREE.Color(0)] - WebGL option
options.precision	String	optional default: 'highp'	WebGL option
options.premultipliedAlpha	Boolean	optional default: true	WebGL option
options.stencil	Boolean	optional default: true	WebGL option
options.depth	Boolean	optional default: true	WebGL option, depth buffer
options.preserveDrawingBuffer	Boolean	optional default: true	WebGL option, retains draw calls, critical for multiple views
options.alpha	Boolean	optional default: true	WebGL option, enables alpha cannel
options.antialias	Boolean	optional default: true	WebGL option, enables aleasing
options.logarithmicDepthBuffer	Boolean	optional default: false	WebGL option

Return:

Object

The constructed Canvas

Example:

import Canvas from 'canvas';
// Create new canvas inside #main
const canvas = new Canvas({ dom: '#main' });
// Parse meshes
let context = await canvas.parser.stream('meshes.txt');

Public Members

public debugLevel: * source

Debug level for this canvas

public dom: * source

The dom node in which the canvas lives

public events: * source

Global events using the Events class

public id: * source

GUID to help identify the canvas

public parser: * source

Parser using webworkers to unpack and optimize compressed packages

public renderer: * source

GL Renderer via three.js

public scopes: * source

Map of managed scopes. This contains dom nodes with references to all the views influenced. It is used internally to track changes in position and size.

Example:

// Get all views affected for node #main
let array = canvas.scopes.get(document.querySelector('#main'));

public version: * source

awv3 version

public views: * source

List of managed views