I am attempting to integrate ammaps into an Angular 2 application. After reviewing the code, it appears that my component is not recognizing the library.
Here is a glimpse at my files:
map.component.html
<script src="http://www.ammap.com/lib/ammap.js" type="text/javascript"> </script>
<script src="http://www.ammap.com/lib/maps/js/worldLow.js" type="text/javascript"></script>
<div id="mapdiv" style="width: 600px; height: 400px;"></div>
map.component.ts
import { Component } from '@angular/core';
//Utilizing a solution found in another article to avoid
//typescript errors regarding undefined types
declare var AmCharts: any;
@Component({
selector: 'newsmap-map',
templateUrl: 'app/views/map.component.html',
directives: [],
styleUrls: ['app/css/map.component.css']
})
export class MapComponent {
AmCharts: any;
//Using ngOnint to trigger the necessary
//javascript code included in the html file
ngOnInit(){
this.AmCharts = new AmCharts({
makeChart( "mapdiv", {
"type": "map",
"dataProvider": {
"map": "worldLow",
"getAreasFromMap": true
},
"areasSettings": {
"autoZoom": true,
"selectedColor": "#CC0000"
},
"smallMap": {}
} )
}
}
}
How can I get this to function properly? Refer to the guide provided by ammaps.
Thank you!