https://github.com/spiridonov-oa/react-whiteboard-pdf
https://github.com/spiridonov-oa/react-whiteboard-pdf
Last synced: 2 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/spiridonov-oa/react-whiteboard-pdf
- Owner: spiridonov-oa
- License: mit
- Created: 2023-05-29T16:27:18.000Z (almost 2 years ago)
- Default Branch: main
- Last Pushed: 2024-03-18T15:25:44.000Z (about 1 year ago)
- Last Synced: 2025-03-27T00:54:11.493Z (20 days ago)
- Language: JavaScript
- Size: 12.9 MB
- Stars: 9
- Watchers: 4
- Forks: 12
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
- my-awesome-list - react-whiteboard-pdf - oa | 9 | (JavaScript)
README
# react-whiteboard-pdf
React virtual whiteboard with PDF and Images upload functionality
Check App demo here:
# App [DEMO](https://statuesque-muffin-fb224e.netlify.app/)
## If you like this project you can help us with $1,000,000 donation or any other amount
github: [github.com/sponsors/spiridonov-oa](https://github.com/sponsors/spiridonov-oa)
patreon: [patreon.com/OlegSpiridonov](https://patreon.com/OlegSpiridonov)
## Compatibility
React 17
## Installation
```shell
npm install react-whiteboard-pdf
```
or
```shell
yarn add react-whiteboard-pdf
```
## Usage
```javascript
const App = () => {
return (
);
};
```
You can change default props
```javascript
import { Whiteboard } from 'react-whiteboard-pdf';
const App = () => {
return (
{}}
onObjectRemoved={(removedObject) => {}}
onObjectAdded={(data, event, canvas) => {}}
onObjectRemoved={(data, event, canvas) => {}}
onZoom={(data, event, canvas) => {}}
onImageUploaded={(data, event, canvas) => {}}
onPDFUploaded={(data, event, canvas) => {}}
onPDFUpdated={(data, event, canvas) => {}}
onPageChange={(data, event, canvas) => {}}
onOptionsChange={(data, event, canvas) => {}}
onSaveCanvasAsImage={(data, event, canvas) => {}}
onConfigChange={(data, event, canvas) => {}}
onSaveCanvasState={(data, event, canvas) => {}}
onDocumentChanged={(data, event, canvas) => {}}
/>
);
};
```
## Development:
```shell
npm i
npm start
```
## Author:
[spiridonov-oa](https://github.com/spiridonov-oa)
## Contributors:
Thanks for your help in building this project
[rodionspi](https://github.com/rodionspi)