mirror of https://github.com/nocodb/nocodb
Pranav C
1 year ago
23 changed files with 148 additions and 23 deletions
@ -0,0 +1,69 @@
|
||||
function copyStylesInline(destinationNode: any, sourceNode: any) { |
||||
const containerElements = ['svg', 'g'] |
||||
for (let cd = 0; cd < destinationNode.childNodes.length; cd++) { |
||||
const child = destinationNode.childNodes[cd] |
||||
if (containerElements.includes(child.tagName)) { |
||||
copyStylesInline(child, sourceNode.childNodes[cd]) |
||||
continue |
||||
} |
||||
|
||||
const style = sourceNode.childNodes[cd].currentStyle || window.getComputedStyle(sourceNode.childNodes[cd]) |
||||
if (style === 'undefined' || style == null) continue |
||||
for (let st = 0; st < style.length; st++) { |
||||
child.style.setProperty(style[st], style.getPropertyValue(style[st])) |
||||
} |
||||
} |
||||
} |
||||
|
||||
function triggerDownload(imgURI: string, fileName: string) { |
||||
const evt = new MouseEvent('click', { |
||||
view: window, |
||||
bubbles: false, |
||||
cancelable: true, |
||||
}) |
||||
const a = document.createElement('a') |
||||
a.setAttribute('download', fileName) |
||||
a.setAttribute('href', imgURI) |
||||
a.setAttribute('target', '_blank') |
||||
a.setAttribute('rel', 'noopener,noreferrer') |
||||
a.dispatchEvent(evt) |
||||
} |
||||
|
||||
function downloadSvg(svg: SVGGraphicsElement, fileName: string) { |
||||
const copy = svg.cloneNode(true) |
||||
|
||||
copyStylesInline(copy, svg) |
||||
|
||||
const canvas = document.createElement('canvas') |
||||
const bbox = svg.getBBox() |
||||
canvas.width = bbox.width |
||||
canvas.height = bbox.height |
||||
|
||||
const ctx = canvas.getContext('2d')! |
||||
ctx.clearRect(0, 0, bbox.width, bbox.height) |
||||
|
||||
const data = new XMLSerializer().serializeToString(copy) |
||||
const DOMURL = window.URL || window.webkitURL || window |
||||
const img = new Image() |
||||
const svgBlob = new Blob([data], { type: 'image/svg+xml;charset=utf-8' }) |
||||
const url = DOMURL.createObjectURL(svgBlob) |
||||
|
||||
img.onload = function () { |
||||
ctx.drawImage(img, 0, 0) |
||||
DOMURL.revokeObjectURL(url) |
||||
if (typeof navigator !== 'undefined' && navigator.msSaveOrOpenBlob) { |
||||
const blob = canvas.msToBlob() |
||||
navigator.msSaveOrOpenBlob(blob, fileName) |
||||
} else { |
||||
const imgURI = canvas.toDataURL('image/png').replace('image/png', 'image/octet-stream') |
||||
triggerDownload(imgURI, fileName) |
||||
} |
||||
console.log(canvas) |
||||
|
||||
// TODO: Somehow canvas dom element is getting deleted
|
||||
// document.removeChild(canvas)
|
||||
} |
||||
img.src = url |
||||
} |
||||
|
||||
export { downloadSvg } |
||||
Loading…
Reference in new issue