Vue Drawing Overview
The Kendo UI Drawing package is a framework-agnostic low-level library for interactive vector graphics. It ships as a standalone npm package (@progress/kendo-drawing) and works with any JavaScript or TypeScript project.
The library exposes a low-level object model for building and manipulating visual scenes and rendering them as SVG or Canvas, exporting them to PNG images or PDF documents, and converting existing DOM content to drawing primitives.
It is the same rendering engine that powers the Kendo UI data-visualization components, such as the Charts, and you can use it independently whenever you need programmatic drawing or client-side export without a dedicated UI layer.
Start Free Trial
Vue Drawing Example
The following example demonstrates the Drawing library in action.
Vue Drawing Key Features
Drawing Shapes
Build scenes from built-in primitives such as Path, Circle, Text, and Image, position them with the geometry helpers, combine them under a Group, and render them on a Surface as SVG or Canvas. Read more about drawing shapes...
Drawing DOM Elements
drawDOM converts a part of or a whole existing page to a Group of drawing primitives that you can further process, render on screen, or export to PDF, SVG, or PNG. Read more about drawing DOM elements...
Export to PDF
exportPDF generates a PDF file from any scene, with configuration options for paper size, margins, multi-page output, embedded fonts, and page templates. Read more about the PDF output...
Export to Images
exportImage exports any scene to a bitmap image in the PNG file format. Read more about exporting to images...
Export to SVG
exportSVG exports any scene to a resolution-independent SVG document that is well-suited for post-processing and archiving. Read more about exporting to SVG...
Shape Tooltips
Bind to the mouseenter and mouseleave events of the Surface to show a tooltip on hover for individual shapes. Read more about shape tooltips...
Licensing
The Kendo UI Drawing package is part of all available Kendo UI libraries. Depending on the trial version and commercial license support that each Kendo UI suite or flavor offers, the Drawing package may be available for trial and commercial users, and as part of the open-source Kendo UI for jQuery Core suite.
Support Options
For any questions about the use of the Vue Drawing, or any of our other components, there are several support options available:
- Kendo UI license holders and anyone in an active trial can take advantage of the outstanding customer support delivered by the actual developers who built the library. To submit a support ticket, use the Kendo UI support system.
- Kendo UI for Vue forums are part of the free support you can get from the community and from the Kendo UI team on all kinds of general issues.
- Kendo UI for Vue feedback portal and roadmap provide information on the features in discussion and also the planned ones for release.
- Kendo UI for Vue uses GitHub Issues as its bug tracker and you can submit any related reports there. Also, check out the closed list.