ts
const paper = require("paper");
function App() {
useEffect(() => {
var canvas = document.getElementById("myCanvas");
paper.setup(canvas);
var path = new paper.Path();
path.strokeColor = "black";
var start = new paper.Point(100, 100);
path.moveTo(start);
path.lineTo(start.add([200, -50]));
paper.view.draw();
}, []);
return (
<div className="App">
<div>
<canvas
id="myCanvas"
data-paper-resize="true"
style={{ height: "100vh", width: "100vw" }}
></canvas>
</div>
</div>
);
}
Paper.js is based on and largely compatible with Scriptographer
-
apple pencilで字を書いて支障ないレスポンス速度だった
-
$ npm install paper
-
var paper = require("paper");
http://paperjs.org/tutorials/paths/smoothing-simplifying-flattening/