<p>html2canvas não é capaz de capturar um SVG no IE11.</p>

Atualizar
Devo fazê-lo funcionar mudando a versão de [email protected] para [email protected].

// import the following 2
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.5.0-beta4/html2canvas.js"
                type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.5.0-beta4/html2canvas.svg.js"
                type="text/javascript"></script>

Pergunta
Será que também existe um "html2canvas.svg.js" para a versão "1.0.0-alpha.10"?

@ Paul-Kijtapart Olá, também estou enfrentando o mesmo problema. Você corrigiu o seu problema?
Atualmente meu projeto funciona apenas para internet explorer, edge, chrome e opera. Procurando por [email protected] que suporta SVG porque meu HTML2PDF não está funcionando para o firefox.

Atualmente, se eu fosse usar v1.0.0-alpha.11 (versão mais recente), não haveria SVG exibido no arquivo pdf.
Se eu fosse usar 0.5.0-beta4, o Firefox não exibirá um único arquivo. Eu olho em seus códigos, é muito difícil para mim entender

Olá @GoodJeans ,

Progresso
Acabei não usando a versão "0.5.0-beta4", pois ela não possui o recurso de "escala".

Tentar
Recentemente, atualizei a versão para "v1.0.0-alpha.11" que, de acordo com o changelog, deve corrigir o erro de membro do IE11 não encontrado.
No entanto, mesmo com esta versão mais recente "v1.0.0-alpha.11", html2canvas não captura a maioria dos componentes SVG no IE11.

Resolução de problemas
De acordo com o log fornecido por html2canvas, este é provavelmente o mesmo problema com alpha.10,

Com o Chrome:

1468ms html2canvas: Finished parsing node tree
1487ms html2canvas: Finished loading 3 images (3) [img, img, img]
1489ms html2canvas: Starting renderer

Com IE11

2137ms html2canvas: Starting node parsing
2451ms html2canvas: Finished parsing node tree
2455ms html2canvas: Finished loading 0 images 
2455ms html2canvas: Starting renderer

A partir do log acima, ao contrário do Chrome, o IE11 não consegue capturar as 3 imagens do dom SVG.

@Paul-Kijtapart entendo .. a versão alfa que estou usando não suporta o SVG no Internet Explorer, infelizmente .. acho que terei que esperar por um próximo lançamento.

Na verdade, estou usando eKoopmans / html2pdf junto com html2canvas.

Ainda não está funcionando, ou seja, 11.Abaixo está o código que estou usando.

let data = document.getElementById ('contentToConvert');
html2canvas (dados, {
onrendered: function (canvas) {
deixe imgWidth = 208;
deixe pageHeight = 295;
deixe imgHeight = canvas.height * imgWidth / canvas.width;
deixe heightLeft = imgHeight;
const contentDataURL = canvas.toDataURL ('image / png')
let pdf = new jspdf ('p', 'mm', 'a4'); // página tamanho A4 do PDF
deixe a posição = 0;
pdf.addImage (contentDataURL, 'PNG', 0, posição, imgWidth, imgHeight)
pdf.save ("testf .pdf '); // PDF gerado
}
});

Eu tenho o mesmo problema e não está funcionando no IE 11. O que tento fazer é gerar o arquivo PDF para a página do relatório com alguns gráficos de highchart (que é svg). Estou usando html2canvas e jspdf. quando eu mudo a versão de [email protected] , ele pode mostrar o gráfico de alto gráfico, mas há outros problemas como layout. Se eu usar [email protected] , todo o gráfico do highchart estará vazio ao gerar a tela.

Estou ansioso para o novo lançamento com esta correção.

Isso ainda é um problema no 1.0.0-rc.1. O IE11 não vê gráficos altos (tela svg), enquanto o Chrome e o Firefox, sim.

Ainda parece ser um problema no 1.0.0-rc.3.

Alguma atualização sobre este problema?
Também estou recebendo dados gráficos desordenados.

Eu atualizei para usar 1.0.0-rc.5. mas ainda não está funcionando.
Sr. Bill Gates, por favor, anuncie o fim do suporte ao IE imediatamente? Eu posso desistir ...

Qualquer notícia? A última coisa que preciso no meu projeto são bons pdfs no IE11.

ainda não está funcionando no IE11 com svg. alguém tem alguma solução alternativa?

@ kuldip27792
use canvg primeiro e, em seguida, use html2canvas

meu colega de equipe sugere uma alternativa, você pode visualizá-la como uma opção se o seu PDF não for obrigatório para gerar em tempo real:

Etapa 1. Instale o google-chrome
Etapa 2. Use o prompt de comando google-chrome para capturar o html renderizado para png / pdf

por exemplo
chrome --headless --print-to-pdf = "d: \ {{caminho e nome do arquivo}}. pdf" https://google.com

Nesse caso, o PDF gerado terá o mesmo estilo, independentemente do navegador usado.
Complicado, mas funciona para mim.

@fiftyk tentei fazer isso, mas também funcionou para o Chrome, mas não para o IE11.
@martinknc obrigado pela sugestão, mas preciso desse tempo real no meu projeto.

@ kuldip27792 acabamos lançando o IE11 em uma página reduzida com um botão para chamar a captura de tela. Não é bom, mas o suficiente para o nosso cliente.

@fiftyk Tentei sua solução e funcionou muito bem. então o que estou fazendo é coletar todos os elementos svg e renderizá-los na tela criada por html2canvas com seus próprios valores de posição. Muito obrigado irmão.

sim, como ahmeturun, isso é o que eu também faço. Em anexo está minha função TypeScript para fazer svgs render na captura de tela:
`
importar {Canvg} de 'canvg';
...
private convertSvgD3ChartsToPngs (): HTMLImageElement [] {
const pngD3Charts: HTMLImageElement [] = [];

Array.from (document.getElementsByTagName ('svg')). Map (svg => {
deixe svgD3ChartCanvas = document.createElement ('canvas');

        // Increase the Pixel Density for the Screenshot
        svgD3ChartCanvas.width = parseInt(svg.getAttribute('width')) * 4;
        svgD3ChartCanvas.height = parseInt(svg.getAttribute('height')) * 4;

        let canvasContext = svgD3ChartCanvas.getContext('2d');

        // Use Canvg to convert the svg into a png
        let convertedSvgToPng = Canvg.fromString(
            canvasContext,
            (svg.parentNode as HTMLElement).innerHTML,
            {
                ignoreDimensions: true,
                scaleWidth: svgD3ChartCanvas.width,
                scaleHeight: svgD3ChartCanvas.height
            }
        );
        convertedSvgToPng.start();

        // Attach new png
        let pngD3Chart = new Image();
        pngD3Chart.src = svgD3ChartCanvas.toDataURL('image/png');
        pngD3Chart.style.width = '100%';
        pngD3Charts.push(pngD3Chart);

        // Remove HTML Attribute and use CSS
        (pngD3Chart as any).width = '';
        svg.parentNode.parentNode.appendChild(pngD3Chart);
        (svg.parentNode as HTMLElement).style.visibility = 'hidden';
        (svg.parentNode as HTMLElement).style.height = '0';
        (svg.parentNode as HTMLElement).style.minHeight = '0';
    });
    return pngD3Charts;
}`