Raster

JointJS+ provides a Raster plugin that enables the ability to export the Paper to PNG and JPEG raster formats.

Installation

Access Raster methods via the format namespace, and pass an instance of dia.Paper and a callback to the method.

import { dia, format } from '@joint/plus';

format.toPNG(paper, function(imageData) { sendToServer(imageData); });

format.toJPEG(paper, function(imageData) { offerForDownload(imageData); }, {
    width: 640,
    height: 320,
    quality: 0.7
});

There is also a UMD version available

Include joint.format.raster.js in your HTML:

index.html

<script src="joint.js"></script>
<script src="joint.format.raster.js"></script>

Access Raster methods through the joint.format namespace:

index.js

joint.format.toPNG(paper, function(imageData) { sendToServer(imageData); });

joint.format.toJPEG(paper, function(imageData) { offerForDownload(imageData); }, {
    width: 640,
    height: 320,
    quality: 0.7
});