Search Posts

Angular4 with highcharts can’t use world.js

I need help with getting my highmap in angular4 app. I installed highcharts using npm.

I included highcharts in my app.component.ts like this because I had some errors that this way solves (maybe it is the wrong way) :

const Highcharts = require('highcharts');
require('highcharts/highcharts-more')(Highcharts);
require('highcharts/modules/solid-gauge')(Highcharts);
require('highcharts/modules/map')(Highcharts);
require('highcharts/modules/data')(Highcharts);
require('highcharts/js/modules/world')(Highcharts);

After that I can use Highcharts for creating the charts without any problems but the problem is that when I want to create a map using Highcharts.js + map.js I can’t seem to get the ‘world.js’ from map collection included or imported or am I missing something? I tried getting the file the same way above require('.../world.js')(Highcharts) and I tried using the "<script src=""> tag in index.html and using the link from highcharts as source, both ways I get the error (link provided down). I also tried copying the data from the ‘world.js’ directly into chart options under 'mapData: Highcharts.maps['custom/world'] = {...},' and it works that way. So what could I do to use it instead of copy-pasting the data?

Error screenshot

Source: AngularJS

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.