@shalvah/vexor

0.3.0 • Public • Published

Rough library for visualizing 2D vectors (linear algebra), inspired by Vector.js.

Goal: simple diagrams of interactive 2D vectors on a Cartesian grid

Current abilities:

  • Graph and style 2D vectors
  • Resize vectors via mouse or touch
  • Vector labels auto-update
  • Easily add sum and difference vectors (which also auto-update)
  • "Mirror" vectors across grids

See demo. Example usage:

let grid = new Grid(`container`, {
  maxX: 200, maxY: 200,
  minX: -200, minY: -200,
  defaultStyles: {
    line: {
      strokeWidth: `2px`,
      stroke: `red`,
    }
  }
});

let vecA = grid.vector('a', { to: {x: 20, y: 100} });

let vecB = grid.vector('b', { to: {x: 150, y: 150} });

let vecAMinusB = grid.vectorDifference(vecA, vecB,
  {
    styles: {stroke: `blue`},
    labelPosition: Vector.LABEL_POSITIONS.midPoint,
    labelContent: vector => `|${vector.name}| ≈ ${Math.round(vector.length)}`
  }
);
let vecAPlusB = grid.vectorSum(vecA, vecB,
  {
    styles: {stroke: `green`},
    labelPosition: Vector.LABEL_POSITIONS.midPoint,
    labelContent: vector => `|${vector.name}| ≈ ${Math.round(vector.length)}`
  }
);

Motivation:

Inspirations:

Package Sidebar

Install

npm i @shalvah/vexor

Weekly Downloads

291

Version

0.3.0

License

MIT

Unpacked Size

30.4 kB

Total Files

19

Last publish

Collaborators

  • shalvah