{"version":3,"sources":["webpack:///./src/components/maps/bubble-maps/BubbleMap.vue","webpack:///src/components/maps/bubble-maps/BubbleMap.vue","webpack:///./src/components/maps/bubble-maps/BubbleMap.vue?9779","webpack:///./src/components/maps/bubble-maps/BubbleMap.vue?8231","webpack:///./src/components/maps/bubble-maps/BubbleMap.vue?a6a9"],"names":["render","_vm","this","_c","_self","staticClass","staticRenderFns","name","props","methods","drawMap","AmCharts","min","max","map","unlistedAreasColor","unlistedAreasAlpha","outlineColor","outlineThickness","balloonText","alpha","mapVar","images","square","dataProvider","type","width","height","color","longitude","latitude","title","value","mounted","component"],"mappings":"yHAAA,IAAIA,EAAS,WAAkB,IAAIC,EAAIC,KAAKC,EAAGF,EAAIG,MAAMD,GAAG,OAAOA,EAAG,MAAM,CAACE,YAAY,gBAErFC,EAAkB,GCWP,G,0FAAA,CACfC,kBAEAC,kBAEAC,SACAC,mBAAA,IAEA,EAFA,OAGA,IACA,KACA,MACA,OACAC,qCAGA,uCACA,cACA,MACAC,KAEA,MACAC,QAKAC,qBAEAA,uBACAA,wDACAA,4CACAA,iBACAC,0BACAC,qBACAC,oBACAC,oBAEAJ,kBACAK,8EACAC,WAGA,OACAC,8BACAC,WAKA,gBACA,gBAGA,uCACA,cAEA,sBACA,MACAC,KAEA,+BACA,SACAC,eACAC,cACAC,QACAC,SACAC,cACAC,yCACAC,uCACAC,aACAC,aAIAlB,iBACAA,oBAIAmB,mBACA,kBC9FiX,I,wBCQ7WC,EAAY,eACd,EACAlC,EACAM,GACA,EACA,KACA,KACA,MAIa,aAAA4B,E,2CCnBf,W","file":"js/chunk-31d481e2.a9cade29.js","sourcesContent":["var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',{staticClass:\"bubble-map\"})\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div class=\"bubble-map\"></div>\n</template>\n\n<script>\nimport 'amcharts3'\nimport 'amcharts3/amcharts/plugins/responsive/responsive.js'\nimport 'amcharts3/amcharts/serial.js'\nimport 'amcharts3/amcharts/themes/light'\n\nimport 'ammap3'\nimport 'ammap3/ammap/maps/js/worldLow'\n\nexport default {\n  name: 'bubble-map',\n\n  props: ['mapData'],\n\n  methods: {\n    drawMap () {\n      /* global AmCharts */\n      let map\n      let minBulletSize = 3\n      let maxBulletSize = 70\n      let min = Infinity\n      let max = -Infinity\n      AmCharts.theme = AmCharts.themes.light\n\n      // get min and max values\n      this.mapData.data.forEach((dataItem) => {\n        let value = dataItem.value\n        if (value < min) {\n          min = value\n        }\n        if (value > max) {\n          max = value\n        }\n      })\n\n      // build map\n      map = new AmCharts.AmMap()\n\n      map.projection = 'winkel3'\n      map.addTitle('Population of the World in 2011', 14, 1, 1, false)\n      map.addTitle('source: Gapminder', 11, 1, 1, 1, false)\n      map.areasSettings = {\n        unlistedAreasColor: '#eee',\n        unlistedAreasAlpha: 1,\n        outlineColor: '#fff',\n        outlineThickness: 2,\n      }\n      map.imagesSettings = {\n        balloonText: '<span style=\"font-size:14px\"><b>[[title]]</b>: [[value]]</span>',\n        alpha: 0.75,\n      }\n\n      let dataProvider = {\n        mapVar: AmCharts.maps.worldLow,\n        images: [],\n      }\n\n      // create circle for each country\n      // it's better to use circle square to show difference between values, not a radius\n      var maxSquare = maxBulletSize * maxBulletSize * 2 * Math.PI\n      var minSquare = minBulletSize * minBulletSize * 2 * Math.PI\n\n      // create circle for each country\n      this.mapData.data.forEach((dataItem) => {\n        var value = dataItem.value\n        // calculate size of a bubble\n        var square = (value - min) / (max - min) * (maxSquare - minSquare) + minSquare\n        if (square < minSquare) {\n          square = minSquare\n        }\n        var size = Math.sqrt(square / (Math.PI * 2))\n        var id = dataItem.code\n        dataProvider.images.push({\n          type: 'circle',\n          width: size,\n          height: size,\n          color: dataItem.color,\n          longitude: this.mapData.latlong[id].longitude,\n          latitude: this.mapData.latlong[id].latitude,\n          title: dataItem.name,\n          value: value,\n        })\n      })\n\n      map.dataProvider = dataProvider\n      map.write(this.$el)\n    },\n  },\n\n  mounted () {\n    this.drawMap()\n  },\n}\n</script>\n\n<style lang='scss'>\n@import '~ammap3/ammap/ammap.css';\n\n.bubble-map {\n  height: 100%;\n}\n</style>\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./BubbleMap.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./BubbleMap.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./BubbleMap.vue?vue&type=template&id=ddaf8850&\"\nimport script from \"./BubbleMap.vue?vue&type=script&lang=js&\"\nexport * from \"./BubbleMap.vue?vue&type=script&lang=js&\"\nimport style0 from \"./BubbleMap.vue?vue&type=style&index=0&id=ddaf8850&prod&lang=scss&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","export * from \"-!../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../../node_modules/css-loader/index.js??ref--8-oneOf-1-1!../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-2!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./BubbleMap.vue?vue&type=style&index=0&id=ddaf8850&prod&lang=scss&\""],"sourceRoot":""}