0.1.0 • Published 8 years ago

svg-peak v0.1.0

Weekly downloads
3
License
MIT
Repository
github
Last release
8 years ago

svg-peak

Draw a simple svg shape with a peak path

Install

npm i svg-peak

API

constructor(options)

OptionAction
wsvg width
hsvg height
ddirection of the drawing top, right, bottom, left
p1first point
p2second point
const Peak = require('svg-peak')

var peak = new Peak({p1:10, p2:50, w:100, h:200})

// also allowed
var peak = Peak({p1:10, p2:50, w:100, h:200})

// all options are also accessible via getter/setter
peak.d = 'top'
peak.p1 = 100

svg()

Return svg node

var peak = Peak({p1:10, p2:50, w:100, h:200})

/*
<svg viewBox="0 0 100 200" preserveAspectRatio="none">
  <path d="M0 0 V10 L50 50 L100 10 V0 z"></path>
</svg>
*/
var svg = peak.svg()

path()

Return path value

var peak = Peak({p1:10, p2:50, w:100, h:200})

peak.p1 = 20
// M0 0 V20 L50 50 L100 20 V0 z
var path = peak.path()

Demo

npm i && npm start

Related

  • svg-cubic
  • svg-line
  • svg-quad

Thanks

Mainly forked / inspired on Codrops and Isaac Montemayor

License

MIT