Charts are not displaying in export pdf

Question

Please refer below example: https://stackblitz.com/edit/angular-ivy-eqvhys?file=src%2Fapp%2Fapp.module.ts,src%2Fapp%2Fapp.component.html,src%2Fapp%2Fapp.component.ts,package.json

Pleas help me to solve chart visibility issue in pdf file

Answer 1

I found a workaround to convert chart into pdf: 

1. Converted chart to png image by using below method

 

    convertChartToImg(chartId): Observable<string> {
            return new Observable(observer => {
              const chart = document.querySelector(chartId);
              if (chart) {
                this.subs.add(this.captureService.getImage(canvas, true)
                  .pipe(
                    tap((img: string) => {
                      observer.next(img)
                    })
                  ).subscribe());
              }
            })
          }

2. Replaced chart with png image.
3. Updated my target element and send pdf.

Working example, please refer the below link:

https://stackblitz.com/edit/angular-ivy-y3x9we?file=src%2Fapp%2Fapp.module.ts,src%2Fapp%2Fapp.component.html,src%2Fapp%2Fapp.component.ts,package.json