|
|
|
@ -1,5 +1,7 @@ |
|
|
|
import jsPDF from 'jspdf' |
|
|
|
import jsPDF from 'jspdf' |
|
|
|
import 'svg2pdf.js' |
|
|
|
import 'svg2pdf.js' |
|
|
|
|
|
|
|
import { SVG } from '@svgdotjs/svg.js' |
|
|
|
|
|
|
|
import { Canvg } from 'canvg' |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const jsPdf = new jsPDF('landscape', 'px', 'a4') |
|
|
|
const jsPdf = new jsPDF('landscape', 'px', 'a4') |
|
|
|
@ -50,23 +52,30 @@ class PdfUmlDownloadStrategy implements IUmlDownloadStrategy { |
|
|
|
|
|
|
|
|
|
|
|
class ImageUmlDownloadStrategy implements IUmlDownloadStrategy { |
|
|
|
class ImageUmlDownloadStrategy implements IUmlDownloadStrategy { |
|
|
|
public download (uml: string, fileName: string): void { |
|
|
|
public download (uml: string, fileName: string): void { |
|
|
|
// const svg = new Blob([uml], { type: 'image/svg+xml;charset=utf-8' })
|
|
|
|
const svg = new Blob([uml], { type: 'image/svg+xml;charset=utf-8' }) |
|
|
|
// const url = URL.createObjectURL(svg)
|
|
|
|
const Url = window.URL || window.webkitURL |
|
|
|
// const img = new Image()
|
|
|
|
const url = Url.createObjectURL(svg) |
|
|
|
// img.onload = () => {
|
|
|
|
const img = document.createElement('img') |
|
|
|
// const canvas = document.createElement('canvas')
|
|
|
|
img.onload = () => { |
|
|
|
// canvas.width = img.width
|
|
|
|
const canvas = document.createElement('canvas') |
|
|
|
// canvas.height = img.height
|
|
|
|
canvas.width = img.naturalWidth |
|
|
|
// const ctx = canvas.getContext('2d')
|
|
|
|
canvas.height = img.naturalHeight |
|
|
|
// ctx.drawImage(img, 0, 0)
|
|
|
|
const ctx = canvas.getContext('2d') |
|
|
|
// const png = canvas.toDataURL('image/png')
|
|
|
|
const scale = window.devicePixelRatio*1 |
|
|
|
// const a = document.createElement('a')
|
|
|
|
canvas.style.width = `${Math.round(img.naturalWidth/scale)}`.concat('px') |
|
|
|
// a.download = fileName.split('/')[1].split('.')[0].concat('.png')
|
|
|
|
canvas.style.height = `${Math.round(img.naturalHeight/scale)}`.concat('px') |
|
|
|
// a.href = png
|
|
|
|
canvas.style.margin = '0' |
|
|
|
// a.click()
|
|
|
|
canvas.style.padding = '0' |
|
|
|
// }
|
|
|
|
ctx.scale(window.devicePixelRatio, window.devicePixelRatio) |
|
|
|
// img.src = url
|
|
|
|
ctx.drawImage(img, 0, 0, Math.round(img.naturalWidth/scale), Math.round(img.naturalHeight/scale)) |
|
|
|
// }
|
|
|
|
const png = canvas.toDataURL('image/png') |
|
|
|
|
|
|
|
const a = document.createElement('a') |
|
|
|
|
|
|
|
a.download = fileName.split('/')[1].split('.')[0].concat('.png') |
|
|
|
|
|
|
|
a.href = png |
|
|
|
|
|
|
|
console.log('about to click the link to download the png!!!') |
|
|
|
|
|
|
|
a.click() |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
img.src = url |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
Joseph Izang
2 years ago