diff --git a/package.json b/package.json index 1db9e048..925a150f 100644 --- a/package.json +++ b/package.json @@ -54,6 +54,8 @@ "@angular2-material/radio": "2.0.0-alpha.2", "@angular2-material/sidenav": "2.0.0-alpha.2", "@angular2-material/toolbar": "2.0.0-alpha.2", + "amcharts3": "github:amcharts/amcharts3", + "ammap3": "github:amcharts/ammap3", "angular2": "2.0.0-beta.15", "bootstrap": "^4.0.0-alpha.2", "bootstrap-loader": "^1.0.8", diff --git a/src/app/pages/maps/components/bubbleMaps/bubbleMaps.component.ts b/src/app/pages/maps/components/bubbleMaps/bubbleMaps.component.ts new file mode 100644 index 00000000..e4130654 --- /dev/null +++ b/src/app/pages/maps/components/bubbleMaps/bubbleMaps.component.ts @@ -0,0 +1,51 @@ +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 = '[[title]]: [[value]]'; + 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'); + } +} diff --git a/src/app/pages/maps/components/bubbleMaps/bubbleMaps.html b/src/app/pages/maps/components/bubbleMaps/bubbleMaps.html new file mode 100644 index 00000000..15918ad4 --- /dev/null +++ b/src/app/pages/maps/components/bubbleMaps/bubbleMaps.html @@ -0,0 +1,3 @@ + +
+
diff --git a/src/app/pages/maps/components/bubbleMaps/bubbleMaps.scss b/src/app/pages/maps/components/bubbleMaps/bubbleMaps.scss new file mode 100644 index 00000000..c31d7a7a --- /dev/null +++ b/src/app/pages/maps/components/bubbleMaps/bubbleMaps.scss @@ -0,0 +1,4 @@ +.bubble-maps { + //TODO: hotfix + height: 320px; +} diff --git a/src/app/pages/maps/components/bubbleMaps/bubbleMaps.service.ts b/src/app/pages/maps/components/bubbleMaps/bubbleMaps.service.ts new file mode 100644 index 00000000..5f84631a --- /dev/null +++ b/src/app/pages/maps/components/bubbleMaps/bubbleMaps.service.ts @@ -0,0 +1,669 @@ +import {Injectable} from 'angular2/core'; +import {layoutColors} from "../../../../theme/theme.constants"; + +@Injectable() +export class BubbleMapsService { + + theme = { + + themeName: "blur", + + AmChart: { + color: layoutColors.defaultText, + backgroundColor: "#FFFFFF" + }, + + AmCoordinateChart: { + colors: [layoutColors.primary, layoutColors.danger, layoutColors.warning, layoutColors.success, layoutColors.info, layoutColors.default, layoutColors.primaryDark, layoutColors.warningLight, layoutColors.successDark, layoutColors.successLight, layoutColors.successBg] + }, + + AmStockChart: { + colors: [layoutColors.primary, layoutColors.danger, layoutColors.warning, layoutColors.success, layoutColors.info, layoutColors.default, layoutColors.primaryDark, layoutColors.warningLight, layoutColors.successDark, layoutColors.successLight, layoutColors.successBg] + }, + + AmSlicedChart: { + colors: [layoutColors.primary, layoutColors.danger, layoutColors.warning, layoutColors.success, layoutColors.info, layoutColors.default, layoutColors.primaryDark, layoutColors.warningLight, layoutColors.successDark, layoutColors.successLight, layoutColors.successBg], + labelTickColor: "#FFFFFF", + labelTickAlpha: 0.3 + }, + + AmRectangularChart: { + zoomOutButtonColor: '#FFFFFF', + zoomOutButtonRollOverAlpha: 0.15, + zoomOutButtonImage: "lens.png" + }, + + AxisBase: { + axisColor: "#FFFFFF", + axisAlpha: 0.3, + gridAlpha: 0.1, + gridColor: "#FFFFFF" + }, + + ChartScrollbar: { + backgroundColor: "#FFFFFF", + backgroundAlpha: 0.12, + graphFillAlpha: 0.5, + graphLineAlpha: 0, + selectedBackgroundColor: "#FFFFFF", + selectedBackgroundAlpha: 0.4, + gridAlpha: 0.15 + }, + + ChartCursor: { + cursorColor: layoutColors.primary, + color: "#FFFFFF", + cursorAlpha: 0.5 + }, + + AmLegend: { + color: "#FFFFFF" + }, + + AmGraph: { + lineAlpha: 0.9 + }, + GaugeArrow: { + color: "#FFFFFF", + alpha: 0.8, + nailAlpha: 0, + innerRadius: "40%", + nailRadius: 15, + startWidth: 15, + borderAlpha: 0.8, + nailBorderAlpha: 0 + }, + + GaugeAxis: { + tickColor: "#FFFFFF", + tickAlpha: 1, + tickLength: 15, + minorTickLength: 8, + axisThickness: 3, + axisColor: '#FFFFFF', + axisAlpha: 1, + bandAlpha: 0.8 + }, + + TrendLine: { + lineColor: layoutColors.danger, + lineAlpha: 0.8 + }, + + // ammap + AreasSettings: { + alpha: 0.8, + color: layoutColors.info, + colorSolid: layoutColors.primaryDark, + unlistedAreasAlpha: 0.4, + unlistedAreasColor: "#FFFFFF", + outlineColor: "#FFFFFF", + outlineAlpha: 0.5, + outlineThickness: 0.5, + rollOverColor: layoutColors.primary, + rollOverOutlineColor: "#FFFFFF", + selectedOutlineColor: "#FFFFFF", + selectedColor: "#f15135", + unlistedAreasOutlineColor: "#FFFFFF", + unlistedAreasOutlineAlpha: 0.5 + }, + + LinesSettings: { + color: "#FFFFFF", + alpha: 0.8 + }, + + ImagesSettings: { + alpha: 0.8, + labelColor: "#FFFFFF", + color: "#FFFFFF", + labelRollOverColor: layoutColors.primaryDark + }, + + ZoomControl: { + buttonFillAlpha: 0.8, + buttonIconColor: layoutColors.default, + buttonRollOverColor: layoutColors.danger, + buttonFillColor: layoutColors.primaryDark, + buttonBorderColor: layoutColors.primaryDark, + buttonBorderAlpha: 0, + buttonCornerRadius: 0, + gridColor: "#FFFFFF", + gridBackgroundColor: "#FFFFFF", + buttonIconAlpha: 0.6, + gridAlpha: 0.6, + buttonSize: 20 + }, + + SmallMap: { + mapColor: "#000000", + rectangleColor: layoutColors.danger, + backgroundColor: "#FFFFFF", + backgroundAlpha: 0.7, + borderThickness: 1, + borderAlpha: 0.8 + }, + + // the defaults below are set using CSS syntax, you can use any existing css property + // if you don't use Stock chart, you can delete lines below + PeriodSelector: { + color: "#FFFFFF" + }, + + PeriodButton: { + color: "#FFFFFF", + background: "transparent", + opacity: 0.7, + border: "1px solid rgba(0, 0, 0, .3)", + MozBorderRadius: "5px", + borderRadius: "5px", + margin: "1px", + outline: "none", + boxSizing: "border-box" + }, + + PeriodButtonSelected: { + color: "#FFFFFF", + backgroundColor: "#b9cdf5", + border: "1px solid rgba(0, 0, 0, .3)", + MozBorderRadius: "5px", + borderRadius: "5px", + margin: "1px", + outline: "none", + opacity: 1, + boxSizing: "border-box" + }, + + PeriodInputField: { + color: "#FFFFFF", + background: "transparent", + border: "1px solid rgba(0, 0, 0, .3)", + outline: "none" + }, + + DataSetSelector: { + color: "#FFFFFF", + selectedBackgroundColor: "#b9cdf5", + rollOverBackgroundColor: "#a8b0e4" + }, + + DataSetCompareList: { + color: "#FFFFFF", + lineHeight: "100%", + boxSizing: "initial", + webkitBoxSizing: "initial", + border: "1px solid rgba(0, 0, 0, .3)" + }, + + DataSetSelect: { + border: "1px solid rgba(0, 0, 0, .3)", + outline: "none" + } + }; + + getTheme() { + return this.theme; + } + + getDataProvider(dataProvider) { + + var latlong = {}; + latlong['AD'] = {'latitude': 42.5, 'longitude': 1.5}; + latlong['AE'] = {'latitude': 24, 'longitude': 54}; + latlong['AF'] = {'latitude': 33, 'longitude': 65}; + latlong['AG'] = {'latitude': 17.05, 'longitude': -61.8}; + latlong['AI'] = {'latitude': 18.25, 'longitude': -63.1667}; + latlong['AL'] = {'latitude': 41, 'longitude': 20}; + latlong['AM'] = {'latitude': 40, 'longitude': 45}; + latlong['AN'] = {'latitude': 12.25, 'longitude': -68.75}; + latlong['AO'] = {'latitude': -12.5, 'longitude': 18.5}; + latlong['AP'] = {'latitude': 35, 'longitude': 105}; + latlong['AQ'] = {'latitude': -90, 'longitude': 0}; + latlong['AR'] = {'latitude': -34, 'longitude': -64}; + latlong['AS'] = {'latitude': -14.3333, 'longitude': -170}; + latlong['AT'] = {'latitude': 47.3333, 'longitude': 13.3333}; + latlong['AU'] = {'latitude': -27, 'longitude': 133}; + latlong['AW'] = {'latitude': 12.5, 'longitude': -69.9667}; + latlong['AZ'] = {'latitude': 40.5, 'longitude': 47.5}; + latlong['BA'] = {'latitude': 44, 'longitude': 18}; + latlong['BB'] = {'latitude': 13.1667, 'longitude': -59.5333}; + latlong['BD'] = {'latitude': 24, 'longitude': 90}; + latlong['BE'] = {'latitude': 50.8333, 'longitude': 4}; + latlong['BF'] = {'latitude': 13, 'longitude': -2}; + latlong['BG'] = {'latitude': 43, 'longitude': 25}; + latlong['BH'] = {'latitude': 26, 'longitude': 50.55}; + latlong['BI'] = {'latitude': -3.5, 'longitude': 30}; + latlong['BJ'] = {'latitude': 9.5, 'longitude': 2.25}; + latlong['BM'] = {'latitude': 32.3333, 'longitude': -64.75}; + latlong['BN'] = {'latitude': 4.5, 'longitude': 114.6667}; + latlong['BO'] = {'latitude': -17, 'longitude': -65}; + latlong['BR'] = {'latitude': -10, 'longitude': -55}; + latlong['BS'] = {'latitude': 24.25, 'longitude': -76}; + latlong['BT'] = {'latitude': 27.5, 'longitude': 90.5}; + latlong['BV'] = {'latitude': -54.4333, 'longitude': 3.4}; + latlong['BW'] = {'latitude': -22, 'longitude': 24}; + latlong['BY'] = {'latitude': 53, 'longitude': 28}; + latlong['BZ'] = {'latitude': 17.25, 'longitude': -88.75}; + latlong['CA'] = {'latitude': 54, 'longitude': -100}; + latlong['CC'] = {'latitude': -12.5, 'longitude': 96.8333}; + latlong['CD'] = {'latitude': 0, 'longitude': 25}; + latlong['CF'] = {'latitude': 7, 'longitude': 21}; + latlong['CG'] = {'latitude': -1, 'longitude': 15}; + latlong['CH'] = {'latitude': 47, 'longitude': 8}; + latlong['CI'] = {'latitude': 8, 'longitude': -5}; + latlong['CK'] = {'latitude': -21.2333, 'longitude': -159.7667}; + latlong['CL'] = {'latitude': -30, 'longitude': -71}; + latlong['CM'] = {'latitude': 6, 'longitude': 12}; + latlong['CN'] = {'latitude': 35, 'longitude': 105}; + latlong['CO'] = {'latitude': 4, 'longitude': -72}; + latlong['CR'] = {'latitude': 10, 'longitude': -84}; + latlong['CU'] = {'latitude': 21.5, 'longitude': -80}; + latlong['CV'] = {'latitude': 16, 'longitude': -24}; + latlong['CX'] = {'latitude': -10.5, 'longitude': 105.6667}; + latlong['CY'] = {'latitude': 35, 'longitude': 33}; + latlong['CZ'] = {'latitude': 49.75, 'longitude': 15.5}; + latlong['DE'] = {'latitude': 51, 'longitude': 9}; + latlong['DJ'] = {'latitude': 11.5, 'longitude': 43}; + latlong['DK'] = {'latitude': 56, 'longitude': 10}; + latlong['DM'] = {'latitude': 15.4167, 'longitude': -61.3333}; + latlong['DO'] = {'latitude': 19, 'longitude': -70.6667}; + latlong['DZ'] = {'latitude': 28, 'longitude': 3}; + latlong['EC'] = {'latitude': -2, 'longitude': -77.5}; + latlong['EE'] = {'latitude': 59, 'longitude': 26}; + latlong['EG'] = {'latitude': 27, 'longitude': 30}; + latlong['EH'] = {'latitude': 24.5, 'longitude': -13}; + latlong['ER'] = {'latitude': 15, 'longitude': 39}; + latlong['ES'] = {'latitude': 40, 'longitude': -4}; + latlong['ET'] = {'latitude': 8, 'longitude': 38}; + latlong['EU'] = {'latitude': 47, 'longitude': 8}; + latlong['FI'] = {'latitude': 62, 'longitude': 26}; + latlong['FJ'] = {'latitude': -18, 'longitude': 175}; + latlong['FK'] = {'latitude': -51.75, 'longitude': -59}; + latlong['FM'] = {'latitude': 6.9167, 'longitude': 158.25}; + latlong['FO'] = {'latitude': 62, 'longitude': -7}; + latlong['FR'] = {'latitude': 46, 'longitude': 2}; + latlong['GA'] = {'latitude': -1, 'longitude': 11.75}; + latlong['GB'] = {'latitude': 54, 'longitude': -2}; + latlong['GD'] = {'latitude': 12.1167, 'longitude': -61.6667}; + latlong['GE'] = {'latitude': 42, 'longitude': 43.5}; + latlong['GF'] = {'latitude': 4, 'longitude': -53}; + latlong['GH'] = {'latitude': 8, 'longitude': -2}; + latlong['GI'] = {'latitude': 36.1833, 'longitude': -5.3667}; + latlong['GL'] = {'latitude': 72, 'longitude': -40}; + latlong['GM'] = {'latitude': 13.4667, 'longitude': -16.5667}; + latlong['GN'] = {'latitude': 11, 'longitude': -10}; + latlong['GP'] = {'latitude': 16.25, 'longitude': -61.5833}; + latlong['GQ'] = {'latitude': 2, 'longitude': 10}; + latlong['GR'] = {'latitude': 39, 'longitude': 22}; + latlong['GS'] = {'latitude': -54.5, 'longitude': -37}; + latlong['GT'] = {'latitude': 15.5, 'longitude': -90.25}; + latlong['GU'] = {'latitude': 13.4667, 'longitude': 144.7833}; + latlong['GW'] = {'latitude': 12, 'longitude': -15}; + latlong['GY'] = {'latitude': 5, 'longitude': -59}; + latlong['HK'] = {'latitude': 22.25, 'longitude': 114.1667}; + latlong['HM'] = {'latitude': -53.1, 'longitude': 72.5167}; + latlong['HN'] = {'latitude': 15, 'longitude': -86.5}; + latlong['HR'] = {'latitude': 45.1667, 'longitude': 15.5}; + latlong['HT'] = {'latitude': 19, 'longitude': -72.4167}; + latlong['HU'] = {'latitude': 47, 'longitude': 20}; + latlong['ID'] = {'latitude': -5, 'longitude': 120}; + latlong['IE'] = {'latitude': 53, 'longitude': -8}; + latlong['IL'] = {'latitude': 31.5, 'longitude': 34.75}; + latlong['IN'] = {'latitude': 20, 'longitude': 77}; + latlong['IO'] = {'latitude': -6, 'longitude': 71.5}; + latlong['IQ'] = {'latitude': 33, 'longitude': 44}; + latlong['IR'] = {'latitude': 32, 'longitude': 53}; + latlong['IS'] = {'latitude': 65, 'longitude': -18}; + latlong['IT'] = {'latitude': 42.8333, 'longitude': 12.8333}; + latlong['JM'] = {'latitude': 18.25, 'longitude': -77.5}; + latlong['JO'] = {'latitude': 31, 'longitude': 36}; + latlong['JP'] = {'latitude': 36, 'longitude': 138}; + latlong['KE'] = {'latitude': 1, 'longitude': 38}; + latlong['KG'] = {'latitude': 41, 'longitude': 75}; + latlong['KH'] = {'latitude': 13, 'longitude': 105}; + latlong['KI'] = {'latitude': 1.4167, 'longitude': 173}; + latlong['KM'] = {'latitude': -12.1667, 'longitude': 44.25}; + latlong['KN'] = {'latitude': 17.3333, 'longitude': -62.75}; + latlong['KP'] = {'latitude': 40, 'longitude': 127}; + latlong['KR'] = {'latitude': 37, 'longitude': 127.5}; + latlong['KW'] = {'latitude': 29.3375, 'longitude': 47.6581}; + latlong['KY'] = {'latitude': 19.5, 'longitude': -80.5}; + latlong['KZ'] = {'latitude': 48, 'longitude': 68}; + latlong['LA'] = {'latitude': 18, 'longitude': 105}; + latlong['LB'] = {'latitude': 33.8333, 'longitude': 35.8333}; + latlong['LC'] = {'latitude': 13.8833, 'longitude': -61.1333}; + latlong['LI'] = {'latitude': 47.1667, 'longitude': 9.5333}; + latlong['LK'] = {'latitude': 7, 'longitude': 81}; + latlong['LR'] = {'latitude': 6.5, 'longitude': -9.5}; + latlong['LS'] = {'latitude': -29.5, 'longitude': 28.5}; + latlong['LT'] = {'latitude': 55, 'longitude': 24}; + latlong['LU'] = {'latitude': 49.75, 'longitude': 6}; + latlong['LV'] = {'latitude': 57, 'longitude': 25}; + latlong['LY'] = {'latitude': 25, 'longitude': 17}; + latlong['MA'] = {'latitude': 32, 'longitude': -5}; + latlong['MC'] = {'latitude': 43.7333, 'longitude': 7.4}; + latlong['MD'] = {'latitude': 47, 'longitude': 29}; + latlong['ME'] = {'latitude': 42.5, 'longitude': 19.4}; + latlong['MG'] = {'latitude': -20, 'longitude': 47}; + latlong['MH'] = {'latitude': 9, 'longitude': 168}; + latlong['MK'] = {'latitude': 41.8333, 'longitude': 22}; + latlong['ML'] = {'latitude': 17, 'longitude': -4}; + latlong['MM'] = {'latitude': 22, 'longitude': 98}; + latlong['MN'] = {'latitude': 46, 'longitude': 105}; + latlong['MO'] = {'latitude': 22.1667, 'longitude': 113.55}; + latlong['MP'] = {'latitude': 15.2, 'longitude': 145.75}; + latlong['MQ'] = {'latitude': 14.6667, 'longitude': -61}; + latlong['MR'] = {'latitude': 20, 'longitude': -12}; + latlong['MS'] = {'latitude': 16.75, 'longitude': -62.2}; + latlong['MT'] = {'latitude': 35.8333, 'longitude': 14.5833}; + latlong['MU'] = {'latitude': -20.2833, 'longitude': 57.55}; + latlong['MV'] = {'latitude': 3.25, 'longitude': 73}; + latlong['MW'] = {'latitude': -13.5, 'longitude': 34}; + latlong['MX'] = {'latitude': 23, 'longitude': -102}; + latlong['MY'] = {'latitude': 2.5, 'longitude': 112.5}; + latlong['MZ'] = {'latitude': -18.25, 'longitude': 35}; + latlong['NA'] = {'latitude': -22, 'longitude': 17}; + latlong['NC'] = {'latitude': -21.5, 'longitude': 165.5}; + latlong['NE'] = {'latitude': 16, 'longitude': 8}; + latlong['NF'] = {'latitude': -29.0333, 'longitude': 167.95}; + latlong['NG'] = {'latitude': 10, 'longitude': 8}; + latlong['NI'] = {'latitude': 13, 'longitude': -85}; + latlong['NL'] = {'latitude': 52.5, 'longitude': 5.75}; + latlong['NO'] = {'latitude': 62, 'longitude': 10}; + latlong['NP'] = {'latitude': 28, 'longitude': 84}; + latlong['NR'] = {'latitude': -0.5333, 'longitude': 166.9167}; + latlong['NU'] = {'latitude': -19.0333, 'longitude': -169.8667}; + latlong['NZ'] = {'latitude': -41, 'longitude': 174}; + latlong['OM'] = {'latitude': 21, 'longitude': 57}; + latlong['PA'] = {'latitude': 9, 'longitude': -80}; + latlong['PE'] = {'latitude': -10, 'longitude': -76}; + latlong['PF'] = {'latitude': -15, 'longitude': -140}; + latlong['PG'] = {'latitude': -6, 'longitude': 147}; + latlong['PH'] = {'latitude': 13, 'longitude': 122}; + latlong['PK'] = {'latitude': 30, 'longitude': 70}; + latlong['PL'] = {'latitude': 52, 'longitude': 20}; + latlong['PM'] = {'latitude': 46.8333, 'longitude': -56.3333}; + latlong['PR'] = {'latitude': 18.25, 'longitude': -66.5}; + latlong['PS'] = {'latitude': 32, 'longitude': 35.25}; + latlong['PT'] = {'latitude': 39.5, 'longitude': -8}; + latlong['PW'] = {'latitude': 7.5, 'longitude': 134.5}; + latlong['PY'] = {'latitude': -23, 'longitude': -58}; + latlong['QA'] = {'latitude': 25.5, 'longitude': 51.25}; + latlong['RE'] = {'latitude': -21.1, 'longitude': 55.6}; + latlong['RO'] = {'latitude': 46, 'longitude': 25}; + latlong['RS'] = {'latitude': 44, 'longitude': 21}; + latlong['RU'] = {'latitude': 60, 'longitude': 100}; + latlong['RW'] = {'latitude': -2, 'longitude': 30}; + latlong['SA'] = {'latitude': 25, 'longitude': 45}; + latlong['SB'] = {'latitude': -8, 'longitude': 159}; + latlong['SC'] = {'latitude': -4.5833, 'longitude': 55.6667}; + latlong['SD'] = {'latitude': 15, 'longitude': 30}; + latlong['SE'] = {'latitude': 62, 'longitude': 15}; + latlong['SG'] = {'latitude': 1.3667, 'longitude': 103.8}; + latlong['SH'] = {'latitude': -15.9333, 'longitude': -5.7}; + latlong['SI'] = {'latitude': 46, 'longitude': 15}; + latlong['SJ'] = {'latitude': 78, 'longitude': 20}; + latlong['SK'] = {'latitude': 48.6667, 'longitude': 19.5}; + latlong['SL'] = {'latitude': 8.5, 'longitude': -11.5}; + latlong['SM'] = {'latitude': 43.7667, 'longitude': 12.4167}; + latlong['SN'] = {'latitude': 14, 'longitude': -14}; + latlong['SO'] = {'latitude': 10, 'longitude': 49}; + latlong['SR'] = {'latitude': 4, 'longitude': -56}; + latlong['ST'] = {'latitude': 1, 'longitude': 7}; + latlong['SV'] = {'latitude': 13.8333, 'longitude': -88.9167}; + latlong['SY'] = {'latitude': 35, 'longitude': 38}; + latlong['SZ'] = {'latitude': -26.5, 'longitude': 31.5}; + latlong['TC'] = {'latitude': 21.75, 'longitude': -71.5833}; + latlong['TD'] = {'latitude': 15, 'longitude': 19}; + latlong['TF'] = {'latitude': -43, 'longitude': 67}; + latlong['TG'] = {'latitude': 8, 'longitude': 1.1667}; + latlong['TH'] = {'latitude': 15, 'longitude': 100}; + latlong['TJ'] = {'latitude': 39, 'longitude': 71}; + latlong['TK'] = {'latitude': -9, 'longitude': -172}; + latlong['TM'] = {'latitude': 40, 'longitude': 60}; + latlong['TN'] = {'latitude': 34, 'longitude': 9}; + latlong['TO'] = {'latitude': -20, 'longitude': -175}; + latlong['TR'] = {'latitude': 39, 'longitude': 35}; + latlong['TT'] = {'latitude': 11, 'longitude': -61}; + latlong['TV'] = {'latitude': -8, 'longitude': 178}; + latlong['TW'] = {'latitude': 23.5, 'longitude': 121}; + latlong['TZ'] = {'latitude': -6, 'longitude': 35}; + latlong['UA'] = {'latitude': 49, 'longitude': 32}; + latlong['UG'] = {'latitude': 1, 'longitude': 32}; + latlong['UM'] = {'latitude': 19.2833, 'longitude': 166.6}; + latlong['US'] = {'latitude': 38, 'longitude': -97}; + latlong['UY'] = {'latitude': -33, 'longitude': -56}; + latlong['UZ'] = {'latitude': 41, 'longitude': 64}; + latlong['VA'] = {'latitude': 41.9, 'longitude': 12.45}; + latlong['VC'] = {'latitude': 13.25, 'longitude': -61.2}; + latlong['VE'] = {'latitude': 8, 'longitude': -66}; + latlong['VG'] = {'latitude': 18.5, 'longitude': -64.5}; + latlong['VI'] = {'latitude': 18.3333, 'longitude': -64.8333}; + latlong['VN'] = {'latitude': 16, 'longitude': 106}; + latlong['VU'] = {'latitude': -16, 'longitude': 167}; + latlong['WF'] = {'latitude': -13.3, 'longitude': -176.2}; + latlong['WS'] = {'latitude': -13.5833, 'longitude': -172.3333}; + latlong['YE'] = {'latitude': 15, 'longitude': 48}; + latlong['YT'] = {'latitude': -12.8333, 'longitude': 45.1667}; + latlong['ZA'] = {'latitude': -29, 'longitude': 24}; + latlong['ZM'] = {'latitude': -15, 'longitude': 30}; + latlong['ZW'] = {'latitude': -20, 'longitude': 30}; + + var mapData = [ + {'code': 'AF', 'name': 'Afghanistan', 'value': 32358260, 'color': layoutColors.primaryDark}, + {'code': 'AL', 'name': 'Albania', 'value': 3215988, 'color': layoutColors.warning}, + {'code': 'DZ', 'name': 'Algeria', 'value': 35980193, 'color': layoutColors.danger}, + {'code': 'AO', 'name': 'Angola', 'value': 19618432, 'color': layoutColors.danger}, + {'code': 'AR', 'name': 'Argentina', 'value': 40764561, 'color': layoutColors.success}, + {'code': 'AM', 'name': 'Armenia', 'value': 3100236, 'color': layoutColors.warning}, + {'code': 'AU', 'name': 'Australia', 'value': 22605732, 'color': layoutColors.warningDark}, + {'code': 'AT', 'name': 'Austria', 'value': 8413429, 'color': layoutColors.warning}, + {'code': 'AZ', 'name': 'Azerbaijan', 'value': 9306023, 'color': layoutColors.warning}, + {'code': 'BH', 'name': 'Bahrain', 'value': 1323535, 'color': layoutColors.primaryDark}, + {'code': 'BD', 'name': 'Bangladesh', 'value': 150493658, 'color': layoutColors.primaryDark}, + {'code': 'BY', 'name': 'Belarus', 'value': 9559441, 'color': layoutColors.warning}, + {'code': 'BE', 'name': 'Belgium', 'value': 10754056, 'color': layoutColors.warning}, + {'code': 'BJ', 'name': 'Benin', 'value': 9099922, 'color': layoutColors.danger}, + {'code': 'BT', 'name': 'Bhutan', 'value': 738267, 'color': layoutColors.primaryDark}, + {'code': 'BO', 'name': 'Bolivia', 'value': 10088108, 'color': layoutColors.success}, + {'code': 'BA', 'name': 'Bosnia and Herzegovina', 'value': 3752228, 'color': layoutColors.warning}, + {'code': 'BW', 'name': 'Botswana', 'value': 2030738, 'color': layoutColors.danger}, + {'code': 'BR', 'name': 'Brazil', 'value': 196655014, 'color': layoutColors.success}, + {'code': 'BN', 'name': 'Brunei', 'value': 405938, 'color': layoutColors.primaryDark}, + {'code': 'BG', 'name': 'Bulgaria', 'value': 7446135, 'color': layoutColors.warning}, + {'code': 'BF', 'name': 'Burkina Faso', 'value': 16967845, 'color': layoutColors.danger}, + {'code': 'BI', 'name': 'Burundi', 'value': 8575172, 'color': layoutColors.danger}, + {'code': 'KH', 'name': 'Cambodia', 'value': 14305183, 'color': layoutColors.primaryDark}, + {'code': 'CM', 'name': 'Cameroon', 'value': 20030362, 'color': layoutColors.danger}, + {'code': 'CA', 'name': 'Canada', 'value': 34349561, 'color': layoutColors.primary}, + {'code': 'CV', 'name': 'Cape Verde', 'value': 500585, 'color': layoutColors.danger}, + {'code': 'CF', 'name': 'Central African Rep.', 'value': 4486837, 'color': layoutColors.danger}, + {'code': 'TD', 'name': 'Chad', 'value': 11525496, 'color': layoutColors.danger}, + {'code': 'CL', 'name': 'Chile', 'value': 17269525, 'color': layoutColors.success}, + {'code': 'CN', 'name': 'China', 'value': 1347565324, 'color': layoutColors.primaryDark}, + {'code': 'CO', 'name': 'Colombia', 'value': 46927125, 'color': layoutColors.success}, + {'code': 'KM', 'name': 'Comoros', 'value': 753943, 'color': layoutColors.danger}, + {'code': 'CD', 'name': 'Congo, Dem. Rep.', 'value': 67757577, 'color': layoutColors.danger}, + {'code': 'CG', 'name': 'Congo, Rep.', 'value': 4139748, 'color': layoutColors.danger}, + {'code': 'CR', 'name': 'Costa Rica', 'value': 4726575, 'color': layoutColors.primary}, + {'code': 'CI', 'name': 'Cote d\'Ivoire', 'value': 20152894, 'color': layoutColors.danger}, + {'code': 'HR', 'name': 'Croatia', 'value': 4395560, 'color': layoutColors.warning}, + {'code': 'CU', 'name': 'Cuba', 'value': 11253665, 'color': layoutColors.primary}, + {'code': 'CY', 'name': 'Cyprus', 'value': 1116564, 'color': layoutColors.warning}, + {'code': 'CZ', 'name': 'Czech Rep.', 'value': 10534293, 'color': layoutColors.warning}, + {'code': 'DK', 'name': 'Denmark', 'value': 5572594, 'color': layoutColors.warning}, + {'code': 'DJ', 'name': 'Djibouti', 'value': 905564, 'color': layoutColors.danger}, + {'code': 'DO', 'name': 'Dominican Rep.', 'value': 10056181, 'color': layoutColors.primary}, + {'code': 'EC', 'name': 'Ecuador', 'value': 14666055, 'color': layoutColors.success}, + {'code': 'EG', 'name': 'Egypt', 'value': 82536770, 'color': layoutColors.danger}, + {'code': 'SV', 'name': 'El Salvador', 'value': 6227491, 'color': layoutColors.primary}, + {'code': 'GQ', 'name': 'Equatorial Guinea', 'value': 720213, 'color': layoutColors.danger}, + {'code': 'ER', 'name': 'Eritrea', 'value': 5415280, 'color': layoutColors.danger}, + {'code': 'EE', 'name': 'Estonia', 'value': 1340537, 'color': layoutColors.warning}, + {'code': 'ET', 'name': 'Ethiopia', 'value': 84734262, 'color': layoutColors.danger}, + {'code': 'FJ', 'name': 'Fiji', 'value': 868406, 'color': layoutColors.warningDark}, + {'code': 'FI', 'name': 'Finland', 'value': 5384770, 'color': layoutColors.warning}, + {'code': 'FR', 'name': 'France', 'value': 63125894, 'color': layoutColors.warning}, + {'code': 'GA', 'name': 'Gabon', 'value': 1534262, 'color': layoutColors.danger}, + {'code': 'GM', 'name': 'Gambia', 'value': 1776103, 'color': layoutColors.danger}, + {'code': 'GE', 'name': 'Georgia', 'value': 4329026, 'color': layoutColors.warning}, + {'code': 'DE', 'name': 'Germany', 'value': 82162512, 'color': layoutColors.warning}, + {'code': 'GH', 'name': 'Ghana', 'value': 24965816, 'color': layoutColors.danger}, + {'code': 'GR', 'name': 'Greece', 'value': 11390031, 'color': layoutColors.warning}, + {'code': 'GT', 'name': 'Guatemala', 'value': 14757316, 'color': layoutColors.primary}, + {'code': 'GN', 'name': 'Guinea', 'value': 10221808, 'color': layoutColors.danger}, + {'code': 'GW', 'name': 'Guinea-Bissau', 'value': 1547061, 'color': layoutColors.danger}, + {'code': 'GY', 'name': 'Guyana', 'value': 756040, 'color': layoutColors.success}, + {'code': 'HT', 'name': 'Haiti', 'value': 10123787, 'color': layoutColors.primary}, + {'code': 'HN', 'name': 'Honduras', 'value': 7754687, 'color': layoutColors.primary}, + {'code': 'HK', 'name': 'Hong Kong, China', 'value': 7122187, 'color': layoutColors.primaryDark}, + {'code': 'HU', 'name': 'Hungary', 'value': 9966116, 'color': layoutColors.warning}, + {'code': 'IS', 'name': 'Iceland', 'value': 324366, 'color': layoutColors.warning}, + {'code': 'IN', 'name': 'India', 'value': 1241491960, 'color': layoutColors.primaryDark}, + {'code': 'ID', 'name': 'Indonesia', 'value': 242325638, 'color': layoutColors.primaryDark}, + {'code': 'IR', 'name': 'Iran', 'value': 74798599, 'color': layoutColors.primaryDark}, + {'code': 'IQ', 'name': 'Iraq', 'value': 32664942, 'color': layoutColors.primaryDark}, + {'code': 'IE', 'name': 'Ireland', 'value': 4525802, 'color': layoutColors.warning}, + {'code': 'IL', 'name': 'Israel', 'value': 7562194, 'color': layoutColors.primaryDark}, + {'code': 'IT', 'name': 'Italy', 'value': 60788694, 'color': layoutColors.warning}, + {'code': 'JM', 'name': 'Jamaica', 'value': 2751273, 'color': layoutColors.primary}, + {'code': 'JP', 'name': 'Japan', 'value': 126497241, 'color': layoutColors.primaryDark}, + {'code': 'JO', 'name': 'Jordan', 'value': 6330169, 'color': layoutColors.primaryDark}, + {'code': 'KZ', 'name': 'Kazakhstan', 'value': 16206750, 'color': layoutColors.primaryDark}, + {'code': 'KE', 'name': 'Kenya', 'value': 41609728, 'color': layoutColors.danger}, + {'code': 'KP', 'name': 'Korea, Dem. Rep.', 'value': 24451285, 'color': layoutColors.primaryDark}, + {'code': 'KR', 'name': 'Korea, Rep.', 'value': 48391343, 'color': layoutColors.primaryDark}, + {'code': 'KW', 'name': 'Kuwait', 'value': 2818042, 'color': layoutColors.primaryDark}, + {'code': 'KG', 'name': 'Kyrgyzstan', 'value': 5392580, 'color': layoutColors.primaryDark}, + {'code': 'LA', 'name': 'Laos', 'value': 6288037, 'color': layoutColors.primaryDark}, + {'code': 'LV', 'name': 'Latvia', 'value': 2243142, 'color': layoutColors.warning}, + {'code': 'LB', 'name': 'Lebanon', 'value': 4259405, 'color': layoutColors.primaryDark}, + {'code': 'LS', 'name': 'Lesotho', 'value': 2193843, 'color': layoutColors.danger}, + {'code': 'LR', 'name': 'Liberia', 'value': 4128572, 'color': layoutColors.danger}, + {'code': 'LY', 'name': 'Libya', 'value': 6422772, 'color': layoutColors.danger}, + {'code': 'LT', 'name': 'Lithuania', 'value': 3307481, 'color': layoutColors.warning}, + {'code': 'LU', 'name': 'Luxembourg', 'value': 515941, 'color': layoutColors.warning}, + {'code': 'MK', 'name': 'Macedonia, FYR', 'value': 2063893, 'color': layoutColors.warning}, + {'code': 'MG', 'name': 'Madagascar', 'value': 21315135, 'color': layoutColors.danger}, + {'code': 'MW', 'name': 'Malawi', 'value': 15380888, 'color': layoutColors.danger}, + {'code': 'MY', 'name': 'Malaysia', 'value': 28859154, 'color': layoutColors.primaryDark}, + {'code': 'ML', 'name': 'Mali', 'value': 15839538, 'color': layoutColors.danger}, + {'code': 'MR', 'name': 'Mauritania', 'value': 3541540, 'color': layoutColors.danger}, + {'code': 'MU', 'name': 'Mauritius', 'value': 1306593, 'color': layoutColors.danger}, + {'code': 'MX', 'name': 'Mexico', 'value': 114793341, 'color': layoutColors.primary}, + {'code': 'MD', 'name': 'Moldova', 'value': 3544864, 'color': layoutColors.warning}, + {'code': 'MN', 'name': 'Mongolia', 'value': 2800114, 'color': layoutColors.primaryDark}, + {'code': 'ME', 'name': 'Montenegro', 'value': 632261, 'color': layoutColors.warning}, + {'code': 'MA', 'name': 'Morocco', 'value': 32272974, 'color': layoutColors.danger}, + {'code': 'MZ', 'name': 'Mozambique', 'value': 23929708, 'color': layoutColors.danger}, + {'code': 'MM', 'name': 'Myanmar', 'value': 48336763, 'color': layoutColors.primaryDark}, + {'code': 'NA', 'name': 'Namibia', 'value': 2324004, 'color': layoutColors.danger}, + {'code': 'NP', 'name': 'Nepal', 'value': 30485798, 'color': layoutColors.primaryDark}, + {'code': 'NL', 'name': 'Netherlands', 'value': 16664746, 'color': layoutColors.warning}, + {'code': 'NZ', 'name': 'New Zealand', 'value': 4414509, 'color': layoutColors.warningDark}, + {'code': 'NI', 'name': 'Nicaragua', 'value': 5869859, 'color': layoutColors.primary}, + {'code': 'NE', 'name': 'Niger', 'value': 16068994, 'color': layoutColors.danger}, + {'code': 'NG', 'name': 'Nigeria', 'value': 162470737, 'color': layoutColors.danger}, + {'code': 'NO', 'name': 'Norway', 'value': 4924848, 'color': layoutColors.warning}, + {'code': 'OM', 'name': 'Oman', 'value': 2846145, 'color': layoutColors.primaryDark}, + {'code': 'PK', 'name': 'Pakistan', 'value': 176745364, 'color': layoutColors.primaryDark}, + {'code': 'PA', 'name': 'Panama', 'value': 3571185, 'color': layoutColors.primary}, + {'code': 'PG', 'name': 'Papua New Guinea', 'value': 7013829, 'color': layoutColors.warningDark}, + {'code': 'PY', 'name': 'Paraguay', 'value': 6568290, 'color': layoutColors.success}, + {'code': 'PE', 'name': 'Peru', 'value': 29399817, 'color': layoutColors.success}, + {'code': 'PH', 'name': 'Philippines', 'value': 94852030, 'color': layoutColors.primaryDark}, + {'code': 'PL', 'name': 'Poland', 'value': 38298949, 'color': layoutColors.warning}, + {'code': 'PT', 'name': 'Portugal', 'value': 10689663, 'color': layoutColors.warning}, + {'code': 'PR', 'name': 'Puerto Rico', 'value': 3745526, 'color': layoutColors.primary}, + {'code': 'QA', 'name': 'Qatar', 'value': 1870041, 'color': layoutColors.primaryDark}, + {'code': 'RO', 'name': 'Romania', 'value': 21436495, 'color': layoutColors.warning}, + {'code': 'RU', 'name': 'Russia', 'value': 142835555, 'color': layoutColors.warning}, + {'code': 'RW', 'name': 'Rwanda', 'value': 10942950, 'color': layoutColors.danger}, + {'code': 'SA', 'name': 'Saudi Arabia', 'value': 28082541, 'color': layoutColors.primaryDark}, + {'code': 'SN', 'name': 'Senegal', 'value': 12767556, 'color': layoutColors.danger}, + {'code': 'RS', 'name': 'Serbia', 'value': 9853969, 'color': layoutColors.warning}, + {'code': 'SL', 'name': 'Sierra Leone', 'value': 5997486, 'color': layoutColors.danger}, + {'code': 'SG', 'name': 'Singapore', 'value': 5187933, 'color': layoutColors.primaryDark}, + {'code': 'SK', 'name': 'Slovak Republic', 'value': 5471502, 'color': layoutColors.warning}, + {'code': 'SI', 'name': 'Slovenia', 'value': 2035012, 'color': layoutColors.warning}, + {'code': 'SB', 'name': 'Solomon Islands', 'value': 552267, 'color': layoutColors.warningDark}, + {'code': 'SO', 'name': 'Somalia', 'value': 9556873, 'color': layoutColors.danger}, + {'code': 'ZA', 'name': 'South Africa', 'value': 50459978, 'color': layoutColors.danger}, + {'code': 'ES', 'name': 'Spain', 'value': 46454895, 'color': layoutColors.warning}, + {'code': 'LK', 'name': 'Sri Lanka', 'value': 21045394, 'color': layoutColors.primaryDark}, + {'code': 'SD', 'name': 'Sudan', 'value': 34735288, 'color': layoutColors.danger}, + {'code': 'SR', 'name': 'Suriname', 'value': 529419, 'color': layoutColors.success}, + {'code': 'SZ', 'name': 'Swaziland', 'value': 1203330, 'color': layoutColors.danger}, + {'code': 'SE', 'name': 'Sweden', 'value': 9440747, 'color': layoutColors.warning}, + {'code': 'CH', 'name': 'Switzerland', 'value': 7701690, 'color': layoutColors.warning}, + {'code': 'SY', 'name': 'Syria', 'value': 20766037, 'color': layoutColors.primaryDark}, + {'code': 'TW', 'name': 'Taiwan', 'value': 23072000, 'color': layoutColors.primaryDark}, + {'code': 'TJ', 'name': 'Tajikistan', 'value': 6976958, 'color': layoutColors.primaryDark}, + {'code': 'TZ', 'name': 'Tanzania', 'value': 46218486, 'color': layoutColors.danger}, + {'code': 'TH', 'name': 'Thailand', 'value': 69518555, 'color': layoutColors.primaryDark}, + {'code': 'TG', 'name': 'Togo', 'value': 6154813, 'color': layoutColors.danger}, + {'code': 'TT', 'name': 'Trinidad and Tobago', 'value': 1346350, 'color': layoutColors.primary}, + {'code': 'TN', 'name': 'Tunisia', 'value': 10594057, 'color': layoutColors.danger}, + {'code': 'TR', 'name': 'Turkey', 'value': 73639596, 'color': layoutColors.warning}, + {'code': 'TM', 'name': 'Turkmenistan', 'value': 5105301, 'color': layoutColors.primaryDark}, + {'code': 'UG', 'name': 'Uganda', 'value': 34509205, 'color': layoutColors.danger}, + {'code': 'UA', 'name': 'Ukraine', 'value': 45190180, 'color': layoutColors.warning}, + {'code': 'AE', 'name': 'United Arab Emirates', 'value': 7890924, 'color': layoutColors.primaryDark}, + {'code': 'GB', 'name': 'United Kingdom', 'value': 62417431, 'color': layoutColors.warning}, + {'code': 'US', 'name': 'United States', 'value': 313085380, 'color': layoutColors.primary}, + {'code': 'UY', 'name': 'Uruguay', 'value': 3380008, 'color': layoutColors.success}, + {'code': 'UZ', 'name': 'Uzbekistan', 'value': 27760267, 'color': layoutColors.primaryDark}, + {'code': 'VE', 'name': 'Venezuela', 'value': 29436891, 'color': layoutColors.success}, + {'code': 'PS', 'name': 'West Bank and Gaza', 'value': 4152369, 'color': layoutColors.primaryDark}, + {'code': 'VN', 'name': 'Vietnam', 'value': 88791996, 'color': layoutColors.primaryDark}, + {'code': 'YE', 'name': 'Yemen, Rep.', 'value': 24799880, 'color': layoutColors.primaryDark}, + {'code': 'ZM', 'name': 'Zambia', 'value': 13474959, 'color': layoutColors.danger}, + {'code': 'ZW', 'name': 'Zimbabwe', 'value': 12754378, 'color': layoutColors.danger} + ]; + + let minBulletSize = 3 + , maxBulletSize = 70 + , min = Infinity + , max = -Infinity; + + // get min and max values + for (var i = 0; i < mapData.length; i++) { + var value = mapData[i].value; + if (value < min) { + min = value; + } + if (value > max) { + max = value; + } + } + + var maxSquare = maxBulletSize * maxBulletSize * 2 * Math.PI; + var minSquare = minBulletSize * minBulletSize * 2 * Math.PI; + + // create circle for each country + for (var i = 0; i < mapData.length; i++) { + var dataItem = mapData[i]; + var value = dataItem.value; + // calculate size of a bubble + var square = (value - min) / (max - min) * (maxSquare - minSquare) + minSquare; + if (square < minSquare) { + square = minSquare; + } + var size = Math.sqrt(square / (Math.PI * 2)); + var id = dataItem.code; + + dataProvider.images.push({ + type: 'circle', + width: size, + height: size, + color: dataItem.color, + longitude: latlong[id].longitude, + latitude: latlong[id].latitude, + title: dataItem.name, + value: value + }); + } + + return dataProvider; + } +} diff --git a/src/app/pages/maps/components/bubbleMaps/index.ts b/src/app/pages/maps/components/bubbleMaps/index.ts new file mode 100644 index 00000000..555d7b88 --- /dev/null +++ b/src/app/pages/maps/components/bubbleMaps/index.ts @@ -0,0 +1 @@ +export * from './bubbleMaps.component'; diff --git a/src/app/pages/maps/maps.component.ts b/src/app/pages/maps/maps.component.ts index 5f6ee391..5f4d7986 100644 --- a/src/app/pages/maps/maps.component.ts +++ b/src/app/pages/maps/maps.component.ts @@ -3,6 +3,7 @@ import {RouteConfig} from 'angular2/router'; import {GoogleMaps} from './components/googleMaps'; import {LeafletMaps} from "./components/leafletMaps"; +import {BubbleMaps} from "./components/bubbleMaps/bubbleMaps.component"; @Component({ selector: 'maps', @@ -23,6 +24,11 @@ import {LeafletMaps} from "./components/leafletMaps"; component: LeafletMaps, path: '/leaflet-maps', }, + { + name: 'BubbleMaps', + component: BubbleMaps, + path: '/bubble-maps', + }, ]) export class Maps { diff --git a/src/app/theme/sidebar/sidebar.service.ts b/src/app/theme/sidebar/sidebar.service.ts index e90444bf..aa3fe251 100644 --- a/src/app/theme/sidebar/sidebar.service.ts +++ b/src/app/theme/sidebar/sidebar.service.ts @@ -35,6 +35,10 @@ export class SidebarService { { title: 'Leaflet Maps', name: 'LeafletMaps', + }, + { + title: 'Bubble Maps', + name: 'BubbleMaps', } ] }, diff --git a/src/app/theme/theme.constants.ts b/src/app/theme/theme.constants.ts index 991b1e4e..9b21442f 100644 --- a/src/app/theme/theme.constants.ts +++ b/src/app/theme/theme.constants.ts @@ -5,11 +5,99 @@ export const layoutSizes = { resWidthHideSidebar: 500 }; +export const colorScheme = { + primary: '#209e91', + info: '#2dacd1', + success: '#90b900', + warning: '#dfb81c', + danger: '#e85656', +}; + +export const bgColorPalette = { + blueStone: '#005562', + surfieGreen: '#0e8174', + silverTree: '#6eba8c', + gossip: '#b9f2a1', + white: '#ffffff', +}; + +export const layoutColors = { + primary: colorScheme.primary, + info: colorScheme.info, + success: colorScheme.success, + warning: colorScheme.warning, + danger: colorScheme.danger, + + primaryLight: tint(colorScheme.primary, 30), + infoLight: tint(colorScheme.info, 30), + successLight: tint(colorScheme.success, 30), + warningLight: tint(colorScheme.warning, 30), + dangerLight: tint(colorScheme.danger, 30), + + primaryDark: shade(colorScheme.primary, 15), + infoDark: shade(colorScheme.info, 15), + successDark: shade(colorScheme.success, 15), + warningDark: shade(colorScheme.warning, 15), + dangerDark: shade(colorScheme.danger, 15), + + primaryBg: tint(colorScheme.primary, 20), + infoBg: tint(colorScheme.info, 20), + successBg: tint(colorScheme.success, 20), + warningBg: tint(colorScheme.warning, 20), + dangerBg: tint(colorScheme.danger, 20), + + default: '#ffffff', + defaultText: '#ffffff', + + bgColorPalette: { + blueStone: bgColorPalette.blueStone, + surfieGreen: bgColorPalette.surfieGreen, + silverTree: bgColorPalette.silverTree, + gossip: bgColorPalette.gossip, + white: bgColorPalette.white, + + blueStoneDark: shade(bgColorPalette.blueStone, 15), + surfieGreenDark: shade(bgColorPalette.surfieGreen, 15), + silverTreeDark: shade(bgColorPalette.silverTree, 15), + gossipDark: shade(bgColorPalette.gossip, 15), + whiteDark: shade(bgColorPalette.white, 5), + } +}; + export const layoutPaths = { images: { root: IMAGES_ROOT, profile: IMAGES_ROOT + 'app/profile/', - amMap: 'assets/img/theme/vendor/ammap//dist/ammap/images/', + amMap: 'assets/img/theme/vendor/ammap/', amChart: 'assets/img/theme/vendor/amcharts/dist/amcharts/images/' } }; + +function shade(color, weight) { + return mix('#000000', color, weight); +} + +function tint(color, weight) { + return mix('#ffffff', color, weight); +} + +//SASS mix function +function mix(color1, color2, weight) { + // convert a decimal value to hex + function d2h(d) { + return d.toString(16); + } + // convert a hex value to decimal + function h2d(h) { + return parseInt(h, 16); + } + + var result = "#"; + for(var i = 1; i < 7; i += 2) { + var color1Part = h2d(color1.substr(i, 2)); + var color2Part = h2d(color2.substr(i, 2)); + var resultPart = d2h(Math.floor(color2Part + (color1Part - color2Part) * (weight / 100.0))); + result += ('0' + resultPart).slice(-2); + } + return result; +} diff --git a/src/assets/img/theme/vendor/ammap/arrowDown.gif b/src/assets/img/theme/vendor/ammap/arrowDown.gif new file mode 100755 index 00000000..68d7db63 Binary files /dev/null and b/src/assets/img/theme/vendor/ammap/arrowDown.gif differ diff --git a/src/assets/img/theme/vendor/ammap/arrowUp.gif b/src/assets/img/theme/vendor/ammap/arrowUp.gif new file mode 100755 index 00000000..f579315c Binary files /dev/null and b/src/assets/img/theme/vendor/ammap/arrowUp.gif differ diff --git a/src/assets/img/theme/vendor/ammap/export.png b/src/assets/img/theme/vendor/ammap/export.png new file mode 100755 index 00000000..259e322c Binary files /dev/null and b/src/assets/img/theme/vendor/ammap/export.png differ diff --git a/src/assets/img/theme/vendor/ammap/homeIcon.gif b/src/assets/img/theme/vendor/ammap/homeIcon.gif new file mode 100755 index 00000000..f753b692 Binary files /dev/null and b/src/assets/img/theme/vendor/ammap/homeIcon.gif differ diff --git a/src/assets/img/theme/vendor/ammap/homeIconWhite.gif b/src/assets/img/theme/vendor/ammap/homeIconWhite.gif new file mode 100755 index 00000000..acd3e815 Binary files /dev/null and b/src/assets/img/theme/vendor/ammap/homeIconWhite.gif differ diff --git a/src/assets/img/theme/vendor/ammap/minus.gif b/src/assets/img/theme/vendor/ammap/minus.gif new file mode 100755 index 00000000..022fa1d8 Binary files /dev/null and b/src/assets/img/theme/vendor/ammap/minus.gif differ diff --git a/src/assets/img/theme/vendor/ammap/panDown.gif b/src/assets/img/theme/vendor/ammap/panDown.gif new file mode 100755 index 00000000..b2a0260e Binary files /dev/null and b/src/assets/img/theme/vendor/ammap/panDown.gif differ diff --git a/src/assets/img/theme/vendor/ammap/panLeft.gif b/src/assets/img/theme/vendor/ammap/panLeft.gif new file mode 100755 index 00000000..4cd7a154 Binary files /dev/null and b/src/assets/img/theme/vendor/ammap/panLeft.gif differ diff --git a/src/assets/img/theme/vendor/ammap/panRight.gif b/src/assets/img/theme/vendor/ammap/panRight.gif new file mode 100755 index 00000000..7c8cd6c5 Binary files /dev/null and b/src/assets/img/theme/vendor/ammap/panRight.gif differ diff --git a/src/assets/img/theme/vendor/ammap/panUp.gif b/src/assets/img/theme/vendor/ammap/panUp.gif new file mode 100755 index 00000000..af293150 Binary files /dev/null and b/src/assets/img/theme/vendor/ammap/panUp.gif differ diff --git a/src/assets/img/theme/vendor/ammap/plus.gif b/src/assets/img/theme/vendor/ammap/plus.gif new file mode 100755 index 00000000..412c2bb1 Binary files /dev/null and b/src/assets/img/theme/vendor/ammap/plus.gif differ diff --git a/src/assets/img/theme/vendor/ammap/xIcon.gif b/src/assets/img/theme/vendor/ammap/xIcon.gif new file mode 100755 index 00000000..c66aad93 Binary files /dev/null and b/src/assets/img/theme/vendor/ammap/xIcon.gif differ diff --git a/src/assets/img/theme/vendor/ammap/xIconH.gif b/src/assets/img/theme/vendor/ammap/xIconH.gif new file mode 100755 index 00000000..ae2b9199 Binary files /dev/null and b/src/assets/img/theme/vendor/ammap/xIconH.gif differ diff --git a/src/custom-typings.d.ts b/src/custom-typings.d.ts index de5e3777..af1a8139 100644 --- a/src/custom-typings.d.ts +++ b/src/custom-typings.d.ts @@ -32,6 +32,7 @@ import * as _ from 'lodash' declare var $:any; declare var GoogleMapsLoader:any; declare var L:any; +declare var AmCharts:any; // Extra variables that live on Global that will be replaced by webpack DefinePlugin declare var ENV: string;