Exporting functionality

[ghost]

I hate to open an issue for this but could someone PLEASE help tell me how to use the exporting feature that exists on Highcharts? Normally when you add exporting: {enabled: true} the small menu shows up in the corner and you can select which option you would like to export. There are a few other ways to enable this normally, such as with the 'navigation' attribute, but I can't seem to get the dropdown/exporting feature to display/work.

I had asked in another issue whether this was a feature in this module and was told simply 'yes' and the issue was closed. Now, I understand that this area should be for issues only really but I have no way of contacting someone who knows this module other than on here.

So, please, before you close this 'issue', could you please please possibly briefly show me how to use that feature with this module or at least point me in the right direction. I have used it many times in the past without an Angular 2 module, but can't seem to get it going in here.

This is an incredible product for Angular 2 and Highcharts and I want to make the most of it so I am just asking kindly for a little bit of help.

Thank you!

[chris-house]

if you want to cheat you probably can put this script tag on your html page

<script src="http://code.highcharts.com/modules/exporting.js"></script>

[chris-house]

@jbsheebs check out https://github.com/gevgeny/angular2-webpack-starter-and-angular2-highcharts/blob/master/src/app/home/home.component.ts

and see how he imports the 3d package. look at his comments on how to find other modules.

[chris-house]

and because Im feeling nice:

import * as Highcharts from 'highcharts';
import * as HichartsExporting from 'highcharts/modules/exporting';

HichartsExporting(Highcharts);
@Component({
    selector: 'chart-widget',
    styleUrls: ['./chart-widget.component.scss'],
    templateUrl: './chart-widget.component.html'
})

[gevgeny]

@jbsheebs did the example above help you ?

[chris-house]

@gevgeny, I confirmed this works

[ghost]

Sorry, late to the party here. Yes it did help very much. Thank you @gevgeny and @crh225 for the examples. Much appreciated.

[lebnic]

I wrote

const Highcharts = require('../../../../../../node_modules/highcharts');
const HighchartsMore = require('../../../../../../node_modules/highcharts/highcharts-more')(Highcharts);
const HichartsExporting = require('../../../../../../node_modules/highcharts/modules/exporting')(Highcharts);

@Component({

[avanithikab]

Print icon is not working for me. Could you please elaborate the answer.

[illsio]

Hi, still struggling very much with the implementation of the import function.
Using 'angular-highcharts' (https://github.com/cebor/angular-highcharts/blob/4/README.md), Versions are angular >=5.0.0 and highcharts >=6.0.0 as required.

import * as Highcharts from 'highcharts'; import HichartsExporting from 'highcharts/modules/exporting.src'; HichartsExporting(Highcharts);

And getting:

TypeError: exporting_src_1.default is not a function

[illsio]

I personally got it working ....
See: cebor/angular-highcharts#139 (comment)