react-fabricjs
![License BSD](https://camo.githubusercontent.com/80bf8df10e36610c8a81817155b69475b5e3f73b6c9c1c6ae5633bc32ebade95/687474703a2f2f696d672e736869656c64732e696f2f62616467652f6c6963656e73652d4253442d626c75652e737667)
React + Fabricjs
npm install react-fabricjs --save
import React from 'react';
import {Canvas,Circle, Image, Path, Text} from 'react-fabricjs';
const App = () => {
return (
<Canvas
ref="canvas"
width="1000"
height="1000"
>
<Circle
ref="circle"
radius={20}
left={100}
top={50}
stroke="green"
/>
<Image
ref="image"
imgElement={document.getElementById('my-image')}
width={100}
height={100}
/>
<Image
src="http://i.imgur.com/jZsNUCi.jpg"
width={300}
height={300}
left={0}
top={500}
/>
<Path
path="M 0 0 L 300 100 L 200 300 z"
fill="red"
stroke="green"
strokeWidth={10}
opacity={0.5}
/>
<Text
text="Click me"
left={0}
top={200}
shadow="rgba(0,0,0,0.3) 5px 5px 5px"
stroke="#ff1318"
strokeWidth={1}
fontStyle="italic"
fontFamily="Hoefler Text"
/>
</Canvas>
);
};