toPNG method fix (#38)

* Changed data conversion from toDataURL to toBlob (for making able to download files larger then 2MB)

* Fixed SVG loading (using blobs)

* Fixed syntax

src/app.js

@@ -75,7 +75,8 @@ processButton('btn-generate', () => {
 
 processButton('btn-get-svg', () => {
   const element = document.createElement('a');
-  element.setAttribute('href', `data:text/plain;charset=utf-8,${diagram.paper.getSVG()}`);
+  const blob = new Blob([diagram.paper.getSVG()], { type: 'text/plain;charset=utf-8' });
+  element.setAttribute('href', window.URL.createObjectURL(blob));
   element.setAttribute('download', 'diagram.svg');
   element.style.display = 'none';
   document.body.appendChild(element);
@@ -86,7 +87,7 @@ processButton('btn-get-svg', () => {
 processButton('btn-get-png', () => {
   diagram.paper.getPNG((data) => {
     const element = document.createElement('a');
-    element.setAttribute('href', data);
+    element.setAttribute('href', window.URL.createObjectURL(data));
     element.setAttribute('download', 'diagram.png');
     element.style.display = 'none';
     document.body.appendChild(element);

src/visual/Paper.js

@@ -106,7 +106,7 @@ export default class Paper extends joint.dia.Paper {
       context.fillStyle = opts.bgrColor || '#FFFFFF';
       context.fillRect(0, 0, canvas.width, canvas.height);
       context.drawImage(image, 0, 0);
-      callback(canvas.toDataURL('image/png'));
+      canvas.toBlob(callback, 'image/png');
     };
   }