Curve is a vector drawing library providing a layer of user interaction tools over SVG. It is used in an Electron-based vector drawing app called Curve.app.
Built on top of svg.js.
- Will load any svg file
- Will serialize (save!) the loaded svg file
- Can create paths (pen tool), rectangles, and ellipses
- Can select and modify paths, rectangles, and ellipses
python -m SimpleHTTPServer 8080
- Load up http://localhost:8080/examples/example.html
Curve is built with browserify and works in the browser, and node.js and Electron applications.
The only dependency is svg.js which is bundled in curve.js
and curve.min.js
. Download curve.js or curve.min.js, and include it in your page
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Curve App</title>
<script src="curve.min.js"></script>
</head>
<body>
<div id="canvas"></div>
</body>
</html>
Then in your JS:
var doc = new Curve.SVGDocument("canvas")
var svgString = "<svg .....>...</svg>"
doc.deserialize(svgString)
doc.initializeTools()
npm install --save curve
And it works similarly
var SVGDocument = require('curve').SVGDocument
var canvas = document.createElement('div')
var doc = new Curve.SVGDocument(canvas)
var svgString = "<svg .....>...</svg>"
doc.deserialize(svgString)
doc.initializeTools()
Officially tested on Chrome
- Requires grunt
npm install -g grunt-cli
- Install grunt modules
npm install
- Automatically compile changes
grunt watch
- Run tests with
npm test
MIT License