plotboilerplate.js

Documentation

js/BezierPath.js

A refactored BezierPath class.

js/Bounds.js

A bounds class with min and max values.
A simple bounds class implementing IBounds.
Version:
  • 1.1.1
Author:
  • Ikaros Kappler
Source:

Requires

  • module:XYCoords
  • module:Vertex
  • module:IBounds

js/Circle.js

A simple circle: center point and radius.
A simple circle class: center point and radius.
Version:
  • 1.1.0
Author:
  • Ikaros Kappler
Source:

Requires

  • module:Line
  • module:Vector
  • module:VertTuple
  • module:Vertex
  • module:SVGSerializale

js/CubicBezierCurve.js

A refactored cubic bezier curve class.

js/Grid.js

A grid class with vertical and horizontal lines.
Note that the PlotBoilerplate already has a Grid instance member. The Grid is not meant to be added to the canvas as a drawable as it encapsulates more an abstract concept of the canvas rather than a drawable object.
Version:
  • 1.0.1
Author:
  • Ikaros Kappler
Source:

Requires

  • module:Vertex

js/KeyHandler.js

A generic key handler. Example =======
KeyHandler
Version:
  • 1.0.4
Author:
  • Ikaros Kappler
Source:

Example

// Javascript
	new KeyHandler( { trackAll : true } )
	    .down('enter',function() { console.log('ENTER was hit.'); } )
	    .press('enter',function() { console.log('ENTER was pressed.'); } )
	    .up('enter',function() { console.log('ENTER was released.'); } )

         .down('e',function() { console.log('e was hit. shift is pressed?',keyHandler.isDown('shift')); } )

	    .up('windows',function() { console.log('windows was released.'); } )
	;

js/Line.js

A line consists of two vertices a and b.

This is some refactored code from my 'Morley Triangle' test
https://github.com/IkarosKappler/morleys-trisector-theorem
Line
Version:
  • 2.1.2
Author:
  • Ikaros Kappler
Source:

Requires

  • module:Vertex

js/MouseHandler.js

A simple mouse handler for demos. Use to avoid load massive libraries like jQuery.

js/PBImage.js

A wrapper for image objects.
As native Image objects have only a position and with and height thei are not suitable for UI dragging interfaces.
Version:
  • 1.0.2
Author:
  • Ikaros Kappler
Source:

Requires

  • module:Vertex,

js/PlotBoilerplate.js

The main class of the PlotBoilerplate.
The main class.
Version:
  • 1.9.2
Author:
  • Ikaros Kappler
Source:

Requires

  • module:Vertex
  • module:Line
  • module:Vector
  • module:Polygon
  • module:PBImage
  • module:VEllipse
  • module:Circle
  • module:MouseHandler
  • module:KeyHandler
  • module:VertexAttr
  • module:CubicBezierCurve
  • module:BezierPath
  • module:Triangle
  • module:drawutils
  • module:drawutilsgl

js/Polygon.js

A polygon class.
Polygon
Version:
  • 1.5.1
Author:
  • Ikaros Kappler
Source:

Requires

  • module:Vertex

js/Triangle.js

A triangle class for triangulations. The class was written for a Delaunay trinagulation demo so it might contain some strange and unexpected functions.
A simple triangle class: three vertices.
Version:
  • 2.3.0
Author:
  • Ikaros Kappler
Source:

Requires

  • module:Vertex,

js/utils/algorithms/CatmullRomPath.js

Compute the Catmull-Rom spline path from a sequence of points (vertices). For comparison to the HobbyCurve I wanted to add a Catmull-Rom path (to show that the HobbyCurve is smoother). This demo implementation was inspired by this Codepen by Blake Bowen https://codepen.io/osublake/pen/BowJed

js/utils/algorithms/CircleIntersections.js

A script for finding the intersection points of two circles (the 'radical line'). Based on the C++ implementation by Robert King https://stackoverflow.com/questions/3349125/circle-circle-intersection-points and the 'Circles and spheres' article by Paul Bourke. http://paulbourke.net/geometry/circlesphere/

js/utils/algorithms/convexHull.js

js/utils/algorithms/convexPolygonIncircle.js

contextPolygonIncircle
Version:
  • 1.0.1
Author:
  • mbostock, extended and ported to TypeScript by Ikaros Kappler
Source:

Requires

  • module:Circle
  • module:Line
  • module:Vertex
  • module:Triangle
  • module:nsectAngle
  • module:geomutils

js/utils/algorithms/CubicSplinePath.js

Compute a natural cubic Bézier spline path from a given sequence of points/vertices. Inspired by http://weitz.de/hobby/

js/utils/algorithms/HobbyPath.js

A HobbyCurve/HobbyPath calculation class: compute a set of optimal cubic Bézier curves from a sequence of vertices. This Hobby curve (path) implementation was strongly inspired by the one by Prof. Dr. Edmund Weitz: // Copyright (c) 2018-2019, Dr. Edmund Weitz. All rights reserved. // The code in this file is written mainly for demonstration purposes // and to illustrate the videos mentioned on the HTML page. It would // be fairly easy to make it shorter and more efficient, but I // refrained from doing this on purpose. Here's the website: http://weitz.de/hobby/

js/utils/datastructures/Girih.js

The Girih datastructure for generating patterns.
Girih
Version:
  • 1.0.1
Author:
  • Ikaros Kappler
Source:

Requires

  • module:Vertex
  • module:GirihTile
  • module:GirihBowtie
  • module:GirihDecagon
  • module:GirihHexagon
  • module:GirihPenroseRhombus
  • module:GirihPentagon
  • module:GirihRhombus

js/utils/datastructures/GirihBowtie.js

The bow tie tile from the Girih set.

js/utils/datastructures/GirihDecagon.js

The decagon tile from the Girih set.

js/utils/datastructures/GirihHexagon.js

The irregular hexagon tile from the Girih set.
GirihHexagon
Version:
  • 2.0.1-alpha
Author:
  • Ikaros Kappler
Source:

Requires

  • module:Bounds
  • module:Circle
  • module:GirihTile
  • module:Line
  • module:Polygon
  • module:TileType
  • module:Vertex

js/utils/datastructures/GirihPenroseRhombus.js

The penrose rhombus tile from the Girih set. The penrose rhombus (angles 36° and 144°) is NOT part of the actual girih tile set!

js/utils/datastructures/GirihPentagon.js

The pentagon tile from the Girih set.

js/utils/datastructures/GirihRhombus.js

The rhombus tile from the Girih set.

js/utils/datastructures/VoronoiCell.js

A simple voronoi cell (part of a voronoi diagram), stored as an array of adjacent triangles.

js/utils/helpers/BezierPathInteractionHelper.js

A helper for adding vertices to and remove vertices from Bézier paths. By default the 'delete' key is used to remove vertices or paths.
BezierPathInteractionHelper
Version:
  • 1.0.1
Author:
  • Ikaros Kappler
Source:

Requires

  • module:AlloyFinger
  • module:BezierPath
  • module:CubicBezierPath
  • module:KeyHandler
  • module:MouseHandler
  • module:PlotBoilerplate
  • module:VertEvent
  • module:Vertex
  • module:XMouseEvent
  • module:XYCoords

js/utils/helpers/VoronoiCell.js

A simple voronoi cell (part of a voronoi diagram), stored as an array of adjacent triangles.

js/Vector.js

A vector (Vertex,Vertex) is a line with a visible direction.

Vectors are drawn with an arrow at their end point.
The Vector class extends the Line class.
Vector
Version:
  • 1.2.1
Author:
  • Ikaros Kappler
Source:

Requires

  • module:Vertex,

js/VEllipse.js

An ellipse class based on two vertices [centerX,centerY] and [radiusX,radiusY].
Ellipses with a center and an x- and a y-axis (stored as a vertex).
Version:
  • 1.0.1
Author:
  • Ikaros Kappler
Source:

Requires

  • module:Vertex

js/Vertex.js

A vertex is a pair of two numbers.

It is used to identify a 2-dimensional point on the x-y-plane.
Vertex
Version:
  • 2.4.1
Author:
  • Ikaros Kappler
Source:

Requires

  • module:VertexAttr

js/VertexAttr.js

The VertexAttr is a helper class to wrap together additional attributes to vertices that do not belong to the 'standard canonical' vertex implementation.

This is some sort of 'userData' object, but the constructor uses a global model to obtain a (configurable) default attribute set to all instances.

js/VertexListeners.js

An event listeners wrapper. This is just a set of three listener queues (drag, dragStart, dragEnd) and their respective firing functions.