mirror/html2canvas
1
0
Fork 0
mirror of https://github.com/niklasvh/html2canvas.git synced 2023-08-10 21:13:10 +03:00
Code Issues Projects Releases Wiki Activity

fix: resolve missing svg serialized content

Browse Source 
dealing with the issue of incomplete rendering content when using 'position: absolute' to render SVG
This commit is contained in:
Halo 2023-04-06 14:41:16 +08:00 committed by GitHub
parent 6020386bbe
commit 8301a3bfe0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 19 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/dom/replaced-elements/svg-element-container.ts
View File

@ -8,16 +8,26 @@ export class SVGElementContainer extends ElementContainer {
intrinsicHeight: number; intrinsicHeight: number;
constructor(context: Context, img: SVGSVGElement) { constructor(context: Context, img: SVGSVGElement) {
super(context, img); super(context, img)
const s = new XMLSerializer(); const s = new XMLSerializer()
const bounds = parseBounds(context, img); const bounds = parseBounds(context, img)
img.setAttribute('width', `${bounds.width}px`); let originPosition: string = img.style.position
img.setAttribute('height', `${bounds.height}px`); img.setAttribute('width', `${bounds.width}px`)
img.setAttribute('height', `${bounds.height}px`)
// fix: resolve missing svg serialized content
// if svg's tag has absolute position, when converting through serializeToString, it will result in missing SVG content.
// so, it is necessary to eliminate positioning before serialization.
img.style.position = 'initial'
this.svg = `data:image/svg+xml,${encodeURIComponent(s.serializeToString(img))}`; this.svg = `data:image/svg+xml,${encodeURIComponent(s.serializeToString(img))}`
this.intrinsicWidth = img.width.baseVal.value;
this.intrinsicHeight = img.height.baseVal.value; // reset position
img.style.position = originPosition
this.intrinsicWidth = img.width.baseVal.value
this.intrinsicHeight = img.height.baseVal.value
this.context.cache.addImage(this.svg); this.context.cache.addImage(this.svg)
} }
} }