Tihomir
Tihomir

Reputation: 124

angular-highcharts conflicts with legacy application's highcharts lib

Angular 2+ is used for new part of Spring MVC application where Highcharts is used. Later, highcharts charting (angular-highcharts) is added to new components written in angular 2+ technology. The same Highcharts 6 version is used at both sides.
At the time angular charting component is initialized Highcharts is already loaded in web page and following Uncaught Error: Highcharts error #16: www.highcharts.com/errors/16 is thrown.

Highcharts is not reloaded by angular component and H.error(code, true) is executed. What is the best way to resolve this conflict?
Should additional Highcharts_X global variable for legacy web application be created? I don't prefer this approach because it is productively used by Higcharts and then it should be changed in the source code at many places.(?)

Is it possible to tell angular-higcharts that the library is already loaded and to use that one?
Or to let it be reloaded without breaking JS with the error?

Upvotes: 1

Views: 142

Answers (1)

user3804427
user3804427

Reputation: 442

You can use Global defined Highcharts instead of load Highcharts twice. For example:

//import * as Highcharts from 'highcharts/highstock';
declare var Highcharts: any;

You must remove loading module string and declare any Variable for build with no problems.

Upvotes: 2

Related Questions