plotboilerplate.js

Class: PlotBoilerplate

PlotBoilerplate(config)

new PlotBoilerplate(config)

The constructor.
Parameters:
Name Type Default Description
config object {} The configuration.
Properties
Name Type Attributes Default Description
canvas HTMLCanvasElement Your canvas element in the DOM (required).
fullSize boolean <optional>
 true If set to true the canvas will gain full window size.
fitToParent boolean <optional>
 true If set to true the canvas will gain the size of its parent container (overrides fullSize).
scaleX number <optional>
 1.0 The initial x-zoom. Default is 1.0.
scaleY number <optional>
 1.0 The initial y-zoom. Default is 1.0.
offsetX number <optional>
 1.0 The initial x-offset. Default is 0.0. Note that autoAdjustOffset=true overrides these values.
offsetY number <optional>
 1.0 The initial y-offset. Default is 0.0. Note that autoAdjustOffset=true overrides these values.
rasterGrid boolean <optional>
 true If set to true the background grid will be drawn rastered.
rasterScaleX boolean <optional>
 1.0 Define the default horizontal raster scale (default=1.0).
rasterScaleY boolean <optional>
 1.0 Define the default vertical raster scale (default=1.0).
rasterAdjustFactor number <optional>
 1.0 The exponential limit for wrapping down the grid. (2.0 means: halve the grid each 2.0*n zoom step).
drawOrigin boolean <optional>
 false Draw a crosshair at (0,0).
autoAdjustOffset boolean <optional>
 true When set to true then the origin of the XY plane will be re-adjusted automatically (see the params offsetAdjust{X,Y}Percent for more).
offsetAdjustXPercent number <optional>
 50 The x-fallback position for the origin after resizing the canvas.
offsetAdjustYPercent number <optional>
 50 The y-fallback position for the origin after resizing the canvas.
defaultCanvasWidth number <optional>
 1024 The canvas size fallback (width) if no automatic resizing is switched on.
defaultCanvasHeight number <optional>
 768 The canvas size fallback (height) if no automatic resizing is switched on.
canvasWidthFactor number <optional>
 1.0 Scaling factor (width) upon the canvas size. In combination with cssScale{X,Y} this can be used to obtain sub pixel resolutions for retina displays.
canvasHeightFactor number <optional>
 1.0 Scaling factor (height) upon the canvas size. In combination with cssScale{X,Y} this can be used to obtain sub pixel resolutions for retina displays.
cssScaleX number <optional>
 1.0 Visually resize the canvas (horizontally) using CSS transforms (scale).
cssScaleY number <optional>
 1.0 Visually resize the canvas (vertically) using CSS transforms (scale).
cssUniformScale boolan <optional>
 true CSS scale x and y obtaining aspect ratio.
autoDetectRetina boolean <optional>
 true When set to true (default) the canvas will try to use the display's pixel ratio.
backgroundColor string <optional>
 #ffffff The backround color.
redrawOnResize boolean <optional>
 true Switch auto-redrawing on resize on/off (some applications might want to prevent automatic redrawing to avoid data loss from the draw buffer).
drawBezierHandleLines boolean <optional>
 true Indicates if Bézier curve handles should be drawn (used for editors, no required in pure visualizations).
drawBezierHandlePoints boolean <optional>
 true Indicates if Bézier curve handle points should be drawn.
preClear function <optional>
 null A callback function that will be triggered just before the draw function clears the canvas (before anything else was drawn).
preDraw function <optional>
 null A callback function that will be triggered just before the draw function starts.
postDraw function <optional>
 null A callback function that will be triggered right after the drawing process finished.
enableMouse boolean <optional>
 true Indicates if the application should handle mouse events for you.
enableTouch boolean <optional>
 true Indicates if the application should handle touch events for you.
enableKeys boolean <optional>
 true Indicates if the application should handle key events for you.
enableMouseWheel boolean <optional>
 true Indicates if the application should handle mouse wheel events for you.
enableGL boolean <optional>
 false Indicates if the application should use the experimental WebGL features (not recommended).
enableSVGExport boolean <optional>
 true Indicates if the SVG export should be enabled (default is true). Note that changes from the postDraw hook might not be visible in the export.
Source:

Methods

add(drawable, redrawopt) → {void}

Add a drawable object.

This must be either:
 * a Vertex
 * a Line
 * a Vector
 * a VEllipse
 * a Circle
 * a Polygon
 * a Triangle
 * a BezierPath
 * a BPImage
Parameters:
Name Type Attributes Default Description
drawable Drawable | Array:.<Drawable:> The drawable (of one of the allowed class instance) to add.
redraw boolean <optional>
 true If true the function will trigger redraw after the drawable(s) was/were added.
Source:
Returns:
Type
void

createGUI() → {dat.gui.GUI}

Creates a control GUI (a dat.gui instance) for this plot boilerplate instance.
Source:
Returns:
Type
dat.gui.GUI

getDraggedElementCount() → {number}

Determine if any elements are currently being dragged (on mouse move or touch move).
Source:
Returns:
The number of elements that are currently being dragged.
Type
number

redraw() → {void}

Trigger redrawing of all objects.

Usually this function is automatically called when objects change.
Source:
Returns:
Type
void

remove(drawable, redrawopt) → {void}

Remove a drawable object.

This must be either:
 * a Vertex
 * a Line
 * a Vector
 * a VEllipse
 * a Circle
 * a Polygon
 * a BezierPath
 * a BPImage
 * a Triangle
Parameters:
Name Type Attributes Default Description
drawable Object The drawable (of one of the allowed class instance) to remove.
redraw boolean <optional>
 false
Source:
Returns:
Type
void

removeVertex(vert, redrawopt) → {void}

Remove a vertex from the vertex list.
Parameters:
Name Type Attributes Default Description
vert Vertex The vertex to remove.
redraw boolean <optional>
 false
Source:
Returns:
Type
void

resizeCanvas() → {void}

This function resizes the canvas to the required settings (toggles fullscreen).

This function is usually only used internally but feel free to call it if resizing required.
Source:
Returns:
Type
void

revertMousePosition(x, y) → {XYCoords}

Revert a transformed mouse position back to canvas coordinates. This is the inverse function of `transformMousePosition`.
Parameters:
Name Type Description
x number The x component of the position to revert.
y number The y component of the position to revert.
Source:
Returns:
The canvas coordinates for the given position.
Type
XYCoords

saveFile() → {void}

Trigger the saveFile.hook.
Source:
Returns:
Type
void

selectVerticesInPolygon(polygon) → {void}

Add all vertices inside the polygon to the current selection.
Parameters:
Name Type Description
polygon Polygon The polygonal selection area.
Source:
Returns:
Type
void

setConsole(con) → {void}

Set the console for this instance.
Parameters:
Name Type Description
con Console The new console object (default is globalThis.console).
Source:
Returns:
Type
void

transformMousePosition(x, y) → {XYCoords}

Transforms the given x-y-(mouse-)point to coordinates respecting the view offset and the zoom settings.
Parameters:
Name Type Description
x number The x position relative to the canvas.
y number The y position relative to the canvas.
Source:
Returns:
A simple object 
{ x : Number, y : Number }
with the transformed coordinates.
Type
XYCoords

viewPort() → {Bounds}

Get the current view port.
Source:
Returns:
The current viewport.
Type
Bounds