npm install --save react-canvas-component
import React from 'react'
import ReactDOM from 'react-dom'
import Canvas from 'react-canvas-component'
function drawCanvas({ctx, time}) {
const {width, height} = ctx.canvas
ctx.save()
ctx.clearRect(0, 0, width, height)
ctx.fillStyle = 'black'
ctx.translate(width / 2, height / 2)
ctx.rotate(((time / 10) % 360) * Math.PI / 180)
ctx.fillRect(-1 * width / 4, -1 * height / 4, width / 2, height / 2)
ctx.restore()
}
class App extends React.Component {
render() {
return <Canvas draw={drawCanvas} width={400} height={400} realtime/>
}
}
ReactDOM.render(<App/>, document.body)git clone https://github.com/nhz-io/react-canvas-component.git
cd react-canvas-component
npm install
npm start
...
check http://localhost:9000
...
npm run dist