[SOLVED] Card as an image

How I can save a ion-card as an image?
Is it possible?

There’s a small JavaScript library you can use to do this called dom-to-image https://github.com/tsayen/dom-to-image.

There’s also another one to render the page or parts of a page to a canvas then converts that canvas to an image. http://html2canvas.hertzen.com/

Or you can simply use your device to take a screenshot of the screen with the card on it.

Hope that helps.


Thanks, BradBurns! I will test this.

My pleasure :slight_smile: I hope it works out for you. Please don’t forget to mark the response as solved if all goes well.

It works perfectly!

Awesome, glad to hear it! :smiley: Which solution did you end up going with?

I used dom-to-image https://github.com/tsayen/dom-to-image.

I am trying to use dom-to-image.
It works when I test on Chrome but not in ionic view and on iphone.
Is it supported?
Thanks a lot!

When you run it in Ionic View and on the device, what is the output from the console logs? You can get the console logs when running on the device if you connect the device to the computer and go into chrome://inspect/#devices

Here is the kind of error i get on iOS simulator:
ERROR: cannot fetch resource: file:///Users/Hassan/Library/Developer/CoreSimulator/Devices/BD82E5AB-046F-44BF-8D93-D9969984705B/data/Containers/Bundle/Application/FB7D1D72-3253-4528-A9D5-853FABF8A308/WineApp.app/www/assets/fonts/ionicons.ttf?v=3.0.0-alpha.3, status: 0

Thanks for your help!

I’m not using an iOS simulator so unfortunately I won’t be of any help there. I would try a search on the ionic forum for something like ios assets.

I did some more tests.
It works for iOS with toSvg and for Android with toPng, toJpeg and to toSvg.
But NOT if I have an in the block I am exporting…

dom to image not working with me on device it give me error :frowning: also html2canvas not working on Arabic language