Parametric 2D graphics in the browser. With pure SVG.
Heads up! This package is based on an earlier version of the spec. We’re planning to update it – but for now you’re better off using the <parametric-svg> custom element or the pair of low-level libraries parse and patch.
Installation
$ npm install parametric-svgUsage
var parametricSvg = require('parametric-svg');…or:
<script src="https://wzrd.in/standalone/parametric-svg@0.0.5"></script>What then? All I’ve got is this quick example – it must do for now: http://jsbin.com/matisi/7/edit?html,js,output.
API
parametricSVG(svgRoot, [parameters])
Parse and render all elements within the svgRoot. Defaults set with <ref> elements will be used for calculation, unless you override them with parameters.
Parameters
| parameter | type | description |
|---|---|---|
svgRoot |
SVGSVGElement | An <svg> element. |
[parameters] |
Object | optional: A hash of additional parameters. They'll extend and override defaults set with <ref> elements. |
Returns VirtualTree, A cached virtual DOM tree for lightning-fast redraws.
parametricSVG(element, parameters)
Pass any SVG node (like <circle>) to parse and render the node and all its descendants.
Parameters
| parameter | type | description |
|---|---|---|
element |
SVGElement | |
parameters |
Object | A hash of parameters. |
Returns VirtualTree, A cached virtual DOM tree for lightning-fast redraws.
parametricSVG(virtualTree, [parameters])
Pass a cached VirtualTree to render the tree without reparsing any DOM. This is the fastest option.
Parameters
| parameter | type | description |
|---|---|---|
virtualTree |
VirtualTree | |
[parameters] |
Object | optional: Supply a hash of additional parameters. They'll extend and replace cached ones. |
Returns VirtualTree, A cached virtual DOM tree for lightning-fast redraws.