Reputation: 124
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
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