Estaba tratando de hacer un generador de pdf para mi tablero. Estaba funcionando bien en Chrome, pero en Firefox e IE, los gráficos se rompen. Además, no puedo ver ciertas imágenes. ¿Cuál podría ser la razón? Esto está en Chrome y Esto está en Firefox

este es mi código:

 download(){ const value = this.routes.url; const segment = /\/portal\/vc-portal\/(.+)/.exec(value)[1]; const filename = segment.replace('/', '_').replace('-', '_'); const element = document.getElementById('router') as HTMLElement; const opt = { pagebreak: {mode:['avoid-all']}, filename: filename + '.pdf', image: { type: 'jpeg', quality: 1}, html2canvas: { scale: 2 }, jsPDF: { unit: 'pc', format: 'a3', orientation: 'portrait' } }; html2pdf().set(opt).from(element).save(); }

¿Cómo es posible que algo que funciona tan bien en un navegador no funcione en el otro?

Este es el código del circle-progress:

 <div class="progress-custom"> <svg class="progress-circle" width="220px" height="200px" xmlns="http://www.w3.org/2000/svg"> <circle class="progress-circle-back" cx="85" cy="85" r="80"></circle> <circle class="progress-circle-prog" [ngClass]="{'progress-color-purple': showInPurple}" cx="85" cy="85" r="80" [ngStyle]="{'stroke-dasharray': progress * 5.04 + ', ' + 999}"></circle> </svg> <div class="progress-text"> <ng-content select="[ktCircleProgressBody]"></ng-content> </div> </div> </div>