react-fabricjs

0.1.6 • Public • Published

react-fabricjs npm version License BSD

React + Fabricjs

Overview

Quick start

Installation

  npm install react-fabricjs --save

Example

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>
    );
};
 

Initialization

Event

Todo

Package Sidebar

Install

npm i react-fabricjs

Weekly Downloads

106

Version

0.1.6

License

BSD-2-Clause

Last publish

Collaborators

  • xhriman