Convert any Bubble group or element into a high-quality image or PDF with just one click! Our 'Save Group as Image' plugin offers seamless capture of complex layouts, including SVGs and custom elements. Perfect for creating screenshots, generating shareable content, or archiving your app dynamic displays.
The Save group or element as Image plugin allows you "save group or element as image" directly on the users browser or/and save it in bubble server database.
Key features:
• Capture any Bubble group or element as an image
• Support for multiple file formats: PNG, JPG, GIF, and PDF
• Adjustable scale for high-resolution outputs
• SVG export support for crisp vector graphics
• Ignore specific elements for customized captures
• Base64 image/PDF data for immediate use in your app
• Comprehensive error handling and success messaging
Our plugin seamlessly integrates with your Bubble workflows, allowing you to automate image generation and enhance your app's functionality.
With options for fine-tuning like scale adjustment and element ignoring, you have full control over your image outputs.
Ideal for creating dynamic screenshots, generating thumbnails, or capturing complex data visualizations, the 'Save Group as Image' plugin is a must-have for any Bubble developer looking to extend their app's visual capabilities.
How does it work?
The plugin renders the group as a canvas image, by reading the DOM and the different styles applied to the elements. For PDFs, the captured canvas is embedded into a real PDF file in the browser.
It does not require any rendering from the server, as the whole image is created on the client's browser.
Browser compatibility:
The plugin should work fine on the following browsers
• Firefox 3.5+
• Google Chrome
• Opera 12+
• IE9+
• Safari 6+
To save a group as image with plugin, simply:
1- Place "Group To Image" on your page
2- Give group ID
3- Call: "Get Image" from workflow
4- Add Event (Conversion completed) to save image in bubble server.
Examples
For more information and examples, please visit the homepage or try the test.
https://roayati.gitbook.io/grouptoimage*The Image is based on the DOM and as such may not be 100% accurate to the real representation as it does not make an actual screenshot, but builds image based on the information available on the page.