Demo
- To draw a line, click the
whiteboard
and move the mouse cursor in thewhiteboard
. - To change line width and line color, select choices.
- To paste an image on the
whiteboard
, type an URL of the image in the text box and press the paste button.
|
|
source code
import React from 'react';
import {Whiteboard, EventStream, EventStore} from '@ohtomi/react-whiteboard';
class Demo extends React.Component {
constructor(props) {
super(props);
this.events = new EventStream();
this.eventStore = new EventStore();
this.width = 450;
this.height = 400;
this.style = {
backgroundColor: 'lightyellow'
};
}
render() {
return (
<Whiteboard events={this.events} eventStore={this.eventStore}
width={this.width} height={this.height} style={this.style}/>
);
}
}