# Usage

PhylocanvasGL is a class which encapsulates the whole tree properties as well as the functions related to viewing the tree and interacting with it.

# PhylocanvasGL class

import PhylocanvasGL from "@phylocanvas/phylocanvas.gl";

const tree = new PhylocanvasGL(
  document.querySelector("#demo"),
  {
    size: { width: 400, height: 300 },
    source: `(Bovine:0.69395,(Gibbon:0.36079,(Orangutan:0.33636,(Gorilla:0.17147,(Chimp:1.19268,Human:0.11927):0.08386):0.06124):0.15057):0.54939,Mouse:1.21460);`
  },
);

# Constructor

The constructor for the PhylocanvasGL class creates a new PhylocanvasGL tree instance.

const tree = new PhylocanvasGL(view, props, plugins);

Parameters:

view - (HTMLDivElement (opens new window) | string, optional) The container in which Phylocanvas.gl should append its canvas. Can be either a HTMLDivElement (opens new window) or the element id. Default value is document.body.
props - (Object, optional) See the Properties section . Default value is {}.
plugins - (Array, optional) See the Using Plugins section . Default value is [].

# Properties

See the Properties section.

# Methods

See the Methods section.

# Remarks

Since Phylocanvas.gl is based on WebGL and uses a single WebGL context, it can only render into a single canvas.

# Source

PhylocanvasGL.js (opens new window)

← Installation Properties →