Search code examples
angularionic-frameworkhighchartsangular7ionic4

net:ERR_FAILED - My application (Ionic 4 / Angular 7) is giving an error when trying to export a Highcharts


Below is the image of the error that occurs every time having to download the graphic, either in PDF, png, JPEG ...

Photo Error

My view.module.ts is:

import Highcharts from 'highcharts/highstock';   

import Exporting from 'highcharts/modules/exporting.src.js'; 

Exporting(Highcharts);

in my view.html:

<ion-header class="ion-header">
    <script src="https://code.highcharts.com/8.0.3/highcharts.js"></script>
    <script src="https://code.highcharts.com/8.0.3/modules/exporting.js"></script>
    <script src="https://code.highcharts.com/8.0.3/highcharts-more.js"></script>
</ion-header> 

in my view.ts:

import * as Highcharts from 'highcharts';

async chartAIM() {
        this.graficoAIM = Highcharts.chart("containerAIM", {options});}

where in options:

 exporting: {
            enabled: true,
            csv: {
                itemDelimiter: ','
            }

Solution

  • It's probably because the URL of the Highcharts export script isn't right. Are you working through a proxy?

    Here are available links:

    <script src="https://code.highcharts.com/modules/exporting.js"></script>  
    <!-- optional -->  
    <script src="https://code.highcharts.com/modules/offline-exporting.js"></script>  
    <script src="https://code.highcharts.com/modules/export-data.js"></script>
    

    P.S.: Please edit your post with detailed informations, code examples and so on. Don't put huge links to your screenshots.

    Also, providing a link to a demo of what you actually got is a must.