mirror of
https://github.com/akveo/ngx-admin.git
synced 2026-01-23 09:46:10 +01:00
52 lines
1.4 KiB
TypeScript
52 lines
1.4 KiB
TypeScript
|
import {Component, ViewEncapsulation} from 'angular2/core';
|
||
|
|
import {BaCard} from '../../../../theme';
|
||
|
|
|
||
|
|
import {layoutColors, layoutPaths} from "../../../../theme/theme.constants";
|
||
|
|
import {BubbleMapsService} from "./bubbleMaps.service";
|
||
|
|
|
||
|
|
require('ammap3');
|
||
|
|
require('ammap3/ammap/maps/js/worldLow');
|
||
|
|
|
||
|
|
@Component({
|
||
|
|
selector: 'bubble-maps',
|
||
|
|
pipes: [],
|
||
|
|
providers: [BubbleMapsService],
|
||
|
|
// otherwise maps won't work
|
||
|
|
encapsulation: ViewEncapsulation.None,
|
||
|
|
styles: [require('ammap3/ammap/ammap.css'), require('./bubbleMaps.scss')],
|
||
|
|
directives: [BaCard],
|
||
|
|
template: require('./bubbleMaps.html'),
|
||
|
|
})
|
||
|
|
export class BubbleMaps {
|
||
|
|
|
||
|
|
constructor(private _bubbleMapsService:BubbleMapsService) {
|
||
|
|
}
|
||
|
|
|
||
|
|
ngAfterViewInit() {
|
||
|
|
AmCharts.theme = this._bubbleMapsService.getTheme();
|
||
|
|
|
||
|
|
let map = new AmCharts.AmMap();
|
||
|
|
|
||
|
|
map.addTitle('Population of the World in 2011', 14);
|
||
|
|
map.addTitle('source: Gapminder', 11);
|
||
|
|
map.areasSettings = {
|
||
|
|
unlistedAreasColor: '#000000',
|
||
|
|
unlistedAreasAlpha: 0.1
|
||
|
|
};
|
||
|
|
map.imagesSettings.balloonText = '<span style="font-size:14px;"><b>[[title]]</b>: [[value]]</span>';
|
||
|
|
map.pathToImages = layoutPaths.images.amMap;
|
||
|
|
|
||
|
|
let dataProvider = {
|
||
|
|
mapVar: AmCharts.maps.worldLow,
|
||
|
|
images: []
|
||
|
|
};
|
||
|
|
|
||
|
|
map.dataProvider = this._bubbleMapsService.getDataProvider(dataProvider);
|
||
|
|
map.export = {
|
||
|
|
enabled: true
|
||
|
|
};
|
||
|
|
|
||
|
|
map.write('map-bubbles');
|
||
|
|
}
|
||
|
|
}
|