Html2canvas: не удалось захватить изображение SVG

+1, тоже сталкиваюсь с этой проблемой.

+1 вот кодовый ящик, который воспроизводит проблему:

https://codesandbox.io/s/wo3oww275k

Я не могу это запечатлеть.

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">...</svg>

Но я могу записать этот файл svg.

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48" height="48">...</svg>

Я просто добавляю ширину и высоту.

Я хочу добавить другое решение, основанное на решении @motodimago , то есть для динамически созданных svg, которые вы не можете статически добавлять ширину или высоту. Я столкнулся с этой проблемой с amcharts, из-за которых я не могу добавить ширину и высоту к созданным svg-диаграммам.

html2canvas(this.ImageCanvas,
        {
            onclone: (element) => {
                const svgElements: any[] = element.body.getElementsByClassName("printable-area")[0].getElementsByTagName("svg");
                Array.from(svgElements).forEach((svgElement) => {
                    const bBox: any = svgElement.getBBox();
                    svgElement.setAttribute("width", bBox.width);
                    svgElement.setAttribute("height", bBox.height);
                });
            },
        }).then((canvas) => {
            document.body.appendChild(canvas);
        });

Спасибо @muratcatal , это

Спасибо @muratcatal

Просто добавляю сюда для SEO, у меня это произошло только в Chrome, а не в Safari.