The constructor.
The event catcher might be a different element positioned over the actual canvas.
A discrete timestamp to identify single render cycles. Note that using system time milliseconds is not a safe way to identify render frames, as on modern powerful machines multiple frames might be rendered within each millisecond.
A wrapper class for draggable items (mostly vertices).
This is just a tiny helper function to determine the render color of vertices.
This function sets the canvas resolution to factor 2.0 (or the preferred pixel ratio of your device) for retina displays. Please not that in non-GL mode this might result in very slow rendering as the canvas buffer size may increase.
Add a drawable object.
This must be either:
* a Vertex * a Line * a Vector * a VEllipse * a VEllipseSector * a Circle * a Polygon * a Triangle * a BezierPath * a BPImage
The drawable (of one of the allowed class instance) to add.
Re-adjust the configured offset depending on the current canvas size and zoom (scaleX and scaleY).
[optional] If set the canvas will redraw with the new offset (default=false).
This function clears the canvas with the configured background color.
This function is usually only used internally.
Clear the selection.
This function is usually only used internally.
this
Creates a control GUI (a dat.gui instance) for this plot boilerplate instance.
Draw the given drawable.
This function is usually only used internally.
The drawable to draw.
The current render time. It will be used to distinct already draw vertices from non-draw-yet vertices.
The drawing library to use to draw lines.
The drawing library to use to fill areas.
Draw all drawables.
This function is usually only used internally.
The current render time. It will be used to distinct already draw vertices from non-draw-yet vertices.
The drawing library to use to draw lines.
The drawing library to use to fill areas.
Draw the grid with the current config settings.
This function is usually only used internally.
The drawing library to use to draw lines.
Draw the origin with the current config settings.
This function is usually only used internally.
The drawing library to use to draw lines.
Draw the select-polygon (if there is one).
This function is usually only used internally.
Draw all vertices that were not yet drawn with the given render time.
This function is usually only used internally.
The current render time. It is used to distinct already draw vertices from non-draw-yet vertices.
Set the current zoom and draw offset to fit the given bounds.
This method currently restores the aspect zoom ratio.
Get the available inner space of the given container.
Size minus padding minus border.
Determine if any elements are currently being dragged (on mouse move or touch move).
The number of elements that are currently being dragged.
Internal helper function used to get 'float' properties from elements. Used to determine border withs and paddings that were defined using CSS.
Find the vertex near the given position.
The position is the absolute vertex position, not the x-y-coordinates on the canvas.
A radius around the position to include into the search. Note that the tolerance will be scaled up/down when zoomed.
The vertex near the given position or undefined if none was found there.
Handle left-click event.
(Helper) Locates the point (index) at the passed position. Using an internal tolerance of 7 pixels.
The result is an object { type : 'bpath', pindex, cindex, pid }
Returns false if no point is near the passed position.
The polygonal selection area.
Or false if none found.
(Helper) The mouse-down handler.
It selects vertices for dragging.
The event to handle
The mouse-drag handler.
It moves selected elements around or performs the panning if the ctrl-key if hold down.
The event to handle
The mouse-up handler.
It clears the dragging-selection.
The event to handle
The mouse-wheel handler.
It performs the zooming.
The event to handle
Trigger redrawing of all objects.
Usually this function is automatically called when objects change.
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
The drawable (of one of the allowed class instance) to remove.
Remove all elements.
If you want to keep the vertices, pass true.
Remove a vertex from the vertex list.
The vertex to remove.
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.
Revert a transformed mouse position back to canvas coordinates.
This is the inverse function of transformMousePosition.
The x component of the position to revert.
The y component of the position to revert.
The canvas coordinates for the given position.
Trigger the saveFile.hook.
Add all vertices inside the polygon to the current selection.
The polygonal selection area.
Set the console for this instance.
The new console object (default is globalThis.console).
Set the new draw offset.
Note: the function will not trigger any redraws.
The new draw offset to use.
Set a new zoom value (and re-adjust the draw offset).
Note: the function will not trigger any redraws.
The new horizontal zoom value.
The new vertical zoom value.
The position of mouse/touch interaction.
Transforms the given x-y-(mouse-)point to coordinates respecting the view offset and the zoom settings.
The x position relative to the canvas.
The y position relative to the canvas.
A simple object
{ x : Number, y : Number } with the transformed coordinates.
Update the CSS scale for the canvas depending onf the cssScale{X,Y} settings.
This function is usually only used inernally.
Get the current view port.
The current viewport.
This function opens a save-as file dialog and – once an output file is selected – stores the current canvas contents as an SVG image.
It is the default hook for saving files and can be overwritten.
A set of helper functions.
Installs vertex listeners to the path's vertices so that controlpoints move with their path points when dragged.
Bézier path points with attr.bezierAutoAdjust==true will have their two control points audo-updated if moved, too (keep path connections smooth).
The path to use auto-adjustment for.
Merge the elements in the 'extension' object into the 'base' object based on the keys of 'base'.
base extended by the new attributes.
A helper function to the the object property boolean value specified by the given key.
The key of the object property (the name).
A default value if the key does not exist.
A helper function to the the object property function-value specified by the given key.
The key of the object property (the name).
A default value if the key does not exist.
A helper function to the the object property numeric value specified by the given key.
The key of the object property (the name).
A default value if the key does not exist.
A helper function to the the object property value specified by the given key.
The key of the object property (the name).
A default value if the key does not exist.
Generated using TypeDoc
The main class of the PlotBoilerplate.
Vertex
Line
Vector
Polygon
PBImage
VEllipse
Circle
MouseHandler
KeyHandler
VertexAttr
CubicBezierCurve
BezierPath
Drawable
DrawConfig
IHooks
PBParams
Triangle
drawutils
drawutilsgl
SVGSerializable
XYCoords
XYDimension