Canvas
Add HTML5 Canvas support for your Vaadin application
This component allows you to draw on a server-side canvas using an API that mimics the HTML5 Canvas.
Features:
- Most of the HTML5 Canvas API
- Mouse click and move events
For more information see the Github page: https://github.com/hezamu/vaadincanvas
Sample code
public class TestUI extends UI { private Canvas canvas; @Override protected void init(VaadinRequest request) { VerticalLayout content = new VerticalLayout(); setContent(content); // Instantiate the component and add it to your UI content.addComponent(canvas = new Canvas()); // Draw a 20x20 filled rectangle with the upper left corner // in coordinate 10,10. It will be filled with the default // color which is black. canvas.fillRect(10, 10, 20, 20); } }
Links
Compatibility
Was this helpful? Need more help?
Leave a comment or a question below. You can also join
the chat on Discord or
ask questions on StackOverflow.
Version
Added mouse event details to mouse listener API.
- Released
- 2017-03-31
- Maturity
- BETA
- License
- Apache License 2.0
Compatibility
- Framework
- Vaadin 8.0+
- Vaadin 7.0+ in 2.1
- Browser
- Firefox
- Opera
- Safari
- Google Chrome
- iOS Browser
- Android Browser
- Internet Explorer
- Windows Phone
- Microsoft Edge