Comments (2)
Hi @Rajan4436 ,
sorry for long response, I had no access to my PC so was not able to respond.
If I understand your task correctly you need to persist image between page loadings.
- You can get image as dataurl by calling
painterroInstance.imageSaver.asDataURL()
. - You can save it to
localStorage
, or to your backend, or using filesystem API, etc. (localStorage
have some quota https://arty.name/localstorage.html, so it will not work for large images) - then just pass dataurl to show method (show method accepts all types of URLs: plain like
http://something/file.jpg
or datadata:...
) - I also added
changeHandler
param so you can define handler which will be fired after each change on canvas
So it can look like this:
Painterro({
changeHandler: function (state) {
localStorage.setItem('painterroImage', this.imageSaver.asDataURL())
}
}).show(localStorage.getItem('painterroImage'));
Fiddle: https://jsfiddle.net/vanbrosh/zL4ay02c/1/
I think passing state as URL params does not sound like a good idea because state takes too much data to fit in URL. Painterro creates canvas snapshot for each change (common approach for raster editors) because it may have raster data parts (loaded, pasted from clipboard, etc). So as I mentioned before you can persist image to some storage. If you need you can associate some id with stored image and pass this id as route param.
from painterro.
Awesome
from painterro.
Related Issues (20)
- Error: Objects are not valid as a React child HOT 1
- Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The source width is 0 HOT 1
- Multiple show() - Can't get element with id=undefined HOT 4
- Some actions (e.g. pixelizing) can't be undone HOT 2
- Working painterro in bootstrap modal window HOT 2
- Add stickers HOT 2
- Small UX/UI Behavior (console.log in main.js)
- Save image without background (using backplateImgUrl) HOT 1
- API to dynamicaly change color HOT 1
- Tool changed event
- Custom tool
- Vite Build on Node 18 cannot initialize Painterro HOT 3
- [webpack-cli] Error: For the selected environment is no default script chunk format available HOT 2
- Add filters for images like sepia or grayscale
- Wrongly added Automatic Linebreak after confirming text HOT 2
- Select text/element is not working outside of the component when i am using this painterro HOT 6
- inserter.js doesn't close modal with paste choices on ESC HOT 2
- Text input becomes misplaced outside the image during on-screen keyboard popup
- The outline (border) used during entering text is rendered into the final image
- Text is cut off if entered on zoomed image
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from painterro.