{"version":3,"sources":["webpack:///./src/components/page/EChartsSimple.vue?9831","webpack:///./node_modules/@babel/runtime/helpers/esm/defineProperty.js","webpack:///src/components/page/EChartsSimple.vue","webpack:///./src/components/page/EChartsSimple.vue?2a47","webpack:///./src/components/page/EChartsSimple.vue","webpack:///./src/components/page/EChartsSimple.vue?6d12"],"names":["render","_vm","this","_h","$createElement","_c","_self","attrs","staticClass","staticRenderFns","_defineProperty","obj","key","value","Object","defineProperty","enumerable","configurable","writable","name","computed","chartPie","$echarts","init","chartLine","chartBar","chartGauge","chartRadar","methods","drawPie","$axios","get","then","title","assign","tooltip","trigger","formatter","color","series","drawLine","xAxis","type","data","res","xData","boundaryGap","splitLine","show","interval","lineStyle","axisLine","axisLabel","margin","textStyle","fontSize","yAxis","axisTick","drawBar","drawGauge","option","setInterval","Math","random","toFixed","drawRadar","radar","center","radius","indicator","resizeChart","window","addEventListener","mounted","component"],"mappings":"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","file":"js/chunk-3944b608.20d91c3e.js","sourcesContent":["var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[_c('el-row',{attrs:{\"gutter\":20}},[_c('el-col',{attrs:{\"span\":8}},[_c('div',{staticClass:\"chart\",attrs:{\"id\":\"pie\"}})]),_c('el-col',{attrs:{\"span\":8}},[_c('div',{staticClass:\"chart\",attrs:{\"id\":\"line\"}})]),_c('el-col',{attrs:{\"span\":8}},[_c('div',{staticClass:\"chart\",attrs:{\"id\":\"bar\"}})])],1),_c('el-row',{attrs:{\"gutter\":20}},[_c('el-col',{attrs:{\"span\":8}},[_c('div',{staticClass:\"chart\",attrs:{\"id\":\"gauge\"}})]),_c('el-col',{attrs:{\"span\":8}},[_c('div',{staticClass:\"chart\",attrs:{\"id\":\"radar\"}})])],1)],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","export default function _defineProperty(obj, key, value) {\n  if (key in obj) {\n    Object.defineProperty(obj, key, {\n      value: value,\n      enumerable: true,\n      configurable: true,\n      writable: true\n    });\n  } else {\n    obj[key] = value;\n  }\n\n  return obj;\n}","<template>\r\n  <div>\r\n    <el-row :gutter=\"20\">\r\n      <el-col :span=\"8\">\r\n        <div id=\"pie\" class=\"chart\"></div>\r\n      </el-col>\r\n      <el-col :span=\"8\">\r\n        <div id=\"line\" class=\"chart\"></div>\r\n      </el-col>\r\n      <el-col :span=\"8\">\r\n        <div id=\"bar\" class=\"chart\"></div>\r\n      </el-col>\r\n    </el-row>\r\n    <el-row :gutter=\"20\">\r\n      <el-col :span=\"8\">\r\n        <div id=\"gauge\" class=\"chart\"></div>\r\n      </el-col>\r\n      <el-col :span=\"8\">\r\n        <div id=\"radar\" class=\"chart\"></div>\r\n      </el-col>\r\n    </el-row>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport Util from '@/assets/js/util'\r\nexport default {\r\n  name: 'EChartsSimple',\r\n  computed: {\r\n    chartPie () {\r\n      return this.$echarts.init(Util.getDom('pie'))\r\n    },\r\n    chartLine () {\r\n      return this.$echarts.init(Util.getDom('line'))\r\n    },\r\n    chartBar () {\r\n      return this.$echarts.init(Util.getDom('bar'))\r\n    },\r\n    chartGauge () {\r\n      return this.$echarts.init(Util.getDom('gauge'))\r\n    },\r\n    chartRadar () {\r\n      return this.$echarts.init(Util.getDom('radar'))\r\n    }\r\n  },\r\n  methods: {\r\n    drawPie () {\r\n      this.$axios.get('/chart-simple/pie').then(res => {\r\n        const title = '中文名使用TOP5'\r\n        this.chartPie.setOption({\r\n          title: Object.assign({}, Util.defaultEchartsOpt.title, { text: title }),\r\n          tooltip: {\r\n            trigger: 'item',\r\n            formatter: '{a} <br/>{b} : {c} ({d}%)'\r\n          },\r\n          color: ['#af84cb', '#3acaa9', '#ebcc6f', '#67c4ed', 'rgba(32, 254, 255, 0.5)'],\r\n          series: [\r\n            {\r\n              name: title,\r\n              type: 'pie',\r\n              radius: '55%',\r\n              center: ['50%', '50%'],\r\n              data: res.data.data,\r\n              roseType: 'radius',\r\n              label: {\r\n                normal: {\r\n                  textStyle: {\r\n                    color: '#777'\r\n                  }\r\n                }\r\n              },\r\n              labelLine: {\r\n                normal: {\r\n                  lineStyle: {\r\n                    color: '#888'\r\n                  },\r\n                  smooth: 0.2,\r\n                  length: 10,\r\n                  length2: 20\r\n                }\r\n              },\r\n              itemStyle: {\r\n                normal: {\r\n                  shadowBlur: 200,\r\n                  shadowColor: 'rgba(0, 0, 0, 0.5)'\r\n                }\r\n              },\r\n              animationType: 'scale',\r\n              animationEasing: 'elasticOut',\r\n              animationDelay: function (idx) {\r\n                return Math.random() * 200\r\n              }\r\n            }\r\n          ]\r\n        })\r\n      })\r\n      return this\r\n    },\r\n    drawLine () {\r\n      this.$axios.get('/chart-simple/line').then(res => {\r\n        const title = '用户周活跃度'\r\n        this.chartLine.setOption({\r\n          title: Object.assign({}, Util.defaultEchartsOpt.title, { text: title }),\r\n          tooltip: {\r\n            trigger: 'axis',\r\n            formatter: '{a} <br/>{b} : {c}'\r\n          },\r\n          xAxis: {\r\n            type: 'category',\r\n            data: res.data.xData,\r\n            boundaryGap: false,\r\n            splitLine: {\r\n              show: false,\r\n              interval: 'auto',\r\n              lineStyle: {\r\n                color: ['#D4DFF5']\r\n              }\r\n            },\r\n            axisLine: {\r\n              lineStyle: {\r\n                color: '#999'\r\n              }\r\n            },\r\n            axisLabel: {\r\n              margin: 10,\r\n              textStyle: {\r\n                fontSize: 12\r\n              }\r\n            }\r\n          },\r\n          yAxis: {\r\n            type: 'value',\r\n            splitLine: {\r\n              lineStyle: {\r\n                color: ['#D4DFF5']\r\n              }\r\n            },\r\n            axisTick: {\r\n              show: false\r\n            },\r\n            axisLine: {\r\n              lineStyle: {\r\n                color: '#999'\r\n              }\r\n            },\r\n            axisLabel: {\r\n              margin: 10,\r\n              textStyle: {\r\n                fontSize: 12\r\n              }\r\n            }\r\n          },\r\n          series: [\r\n            {\r\n              name: title,\r\n              data: res.data.yData,\r\n              type: 'line',\r\n              smooth: true,\r\n              showSymbol: false,\r\n              symbol: 'circle',\r\n              symbolSize: 6,\r\n              areaStyle: {\r\n                normal: {\r\n                  color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [{\r\n                    offset: 0,\r\n                    color: 'rgba(199, 237, 250, 0.5)'\r\n                  }, {\r\n                    offset: 1,\r\n                    color: 'rgba(199, 237, 250, 0.2)'\r\n                  }], false)\r\n                }\r\n              },\r\n              itemStyle: {\r\n                normal: {\r\n                  color: 'rgba(32, 254, 255, 0.5)'\r\n                }\r\n              },\r\n              lineStyle: {\r\n                normal: {\r\n                  width: 2\r\n                }\r\n              }\r\n            }\r\n          ]\r\n        })\r\n      })\r\n      return this\r\n    },\r\n    drawBar () {\r\n      this.$axios.get('/chart-simple/bar').then(res => {\r\n        const title = '商品日销量'\r\n        this.chartBar.setOption({\r\n          title: Object.assign({}, Util.defaultEchartsOpt.title, { text: title }),\r\n          tooltip: {\r\n            trigger: 'item',\r\n            formatter: '{a} <br/>{b} : {c}'\r\n          },\r\n          xAxis: {\r\n            type: 'category',\r\n            data: res.data.xData,\r\n            axisLine: {\r\n              lineStyle: {\r\n                color: '#999'\r\n              }\r\n            },\r\n            axisLabel: {\r\n              margin: 10,\r\n              textStyle: {\r\n                fontSize: 12\r\n              }\r\n            }\r\n          },\r\n          yAxis: {\r\n            type: 'value',\r\n            splitLine: {\r\n              lineStyle: {\r\n                color: ['#D4DFF5']\r\n              }\r\n            },\r\n            axisTick: {\r\n              show: false\r\n            },\r\n            axisLine: {\r\n              lineStyle: {\r\n                color: '#999'\r\n              }\r\n            },\r\n            axisLabel: {\r\n              margin: 10,\r\n              textStyle: {\r\n                fontSize: 12\r\n              }\r\n            }\r\n          },\r\n          series: [\r\n            {\r\n              name: title,\r\n              data: res.data.yData,\r\n              type: 'bar',\r\n              symbol: 'triangle',\r\n              symbolSize: 20,\r\n              lineStyle: {\r\n                normal: {\r\n                  color: 'green',\r\n                  width: 4,\r\n                  type: 'dashed'\r\n                }\r\n              },\r\n              barWidth: 25,\r\n              itemStyle: {\r\n                normal: {\r\n                  barBorderRadius: 30,\r\n                  color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1,\r\n                    [\r\n                      {\r\n                        offset: 0,\r\n                        color: '#00feff'\r\n                      },\r\n                      {\r\n                        offset: 0.5,\r\n                        color: '#027eff'\r\n                      },\r\n                      {\r\n                        offset: 1,\r\n                        color: '#0286ff'\r\n                      }\r\n                    ])\r\n                }\r\n              }\r\n            }\r\n          ]\r\n        })\r\n      })\r\n      return this\r\n    },\r\n    drawGauge () {\r\n      const title = '平均速度(km/h)'\r\n      const option = {\r\n        title: Object.assign({}, Util.defaultEchartsOpt.title, { text: title }),\r\n        series: [\r\n          {\r\n            name: title,\r\n            type: 'gauge',\r\n            center: ['50%', '60%'],\r\n            min: 0,\r\n            max: 220,\r\n            splitNumber: 11,\r\n            radius: '80%',\r\n            axisLine: {\r\n              lineStyle: {\r\n                width: 7\r\n              }\r\n            },\r\n            axisTick: {\r\n              length: 12,\r\n              lineStyle: {\r\n                color: 'auto'\r\n              }\r\n            },\r\n            splitLine: {\r\n              length: 15,\r\n              lineStyle: {\r\n                color: 'auto'\r\n              }\r\n            },\r\n            axisLine: {\r\n              show: true,\r\n              lineStyle: {\r\n                width: 20,\r\n                color: [\r\n                  [\r\n                    1,\r\n                    new this.$echarts.graphic.LinearGradient(0, 0, 1, 0, [\r\n                      {\r\n                        offset: 0,\r\n                        color: '#3acaa9'\r\n                      },\r\n                      {\r\n                        offset: 1,\r\n                        color: '#0286ff'\r\n                      }\r\n                    ])\r\n                  ]\r\n                ]\r\n              }\r\n            },\r\n            axisLabel: {\r\n              backgroundColor: 'auto',\r\n              borderRadius: 2,\r\n              color: '#eee',\r\n              padding: 3,\r\n              textShadowBlur: 2,\r\n              textShadowOffsetX: 1,\r\n              textShadowOffsetY: 1,\r\n              textShadowColor: '#222'\r\n            },\r\n            pointer: {\r\n              width: 5\r\n            },\r\n            detail: {\r\n              formatter: value => parseFloat(value).toFixed(2),\r\n              fontWeight: 'bolder',\r\n              borderRadius: 3,\r\n              backgroundColor: '',\r\n              shadowBlur: 5,\r\n              shadowColor: '#333',\r\n              shadowOffsetY: 3,\r\n              borderWidth: 2,\r\n              textShadowBlur: 2,\r\n              textShadowColor: '#222e7d',\r\n              width: 70,\r\n              fontSize: 20,\r\n              color: '#eee'\r\n            },\r\n            data: [{ value: 40, name: '' }]\r\n          }]\r\n      }\r\n      this.$axios.get('/chart-simple/gauge').then(res => {\r\n        option.series[0].data[0].value = res.data.value\r\n        this.chartGauge.setOption(option)\r\n\r\n        setInterval(() => {\r\n          option.series[0].data[0].value = (Math.random() * 100).toFixed(2)\r\n          this.chartGauge.setOption(option, true)\r\n        }, 2000)\r\n      })\r\n\r\n      return this\r\n    },\r\n    drawRadar () {\r\n      this.$axios.get('/chart-simple/radar').then(res => {\r\n        const title = '部门预算支出比'\r\n        this.chartRadar.setOption({\r\n          title: Object.assign({}, Util.defaultEchartsOpt.title, { text: title }),\r\n          tooltip: {},\r\n          radar: {\r\n            name: {\r\n              textStyle: {\r\n                color: '#999'\r\n              }\r\n            },\r\n            center: ['50%', '58%'],\r\n            radius: '57%',\r\n            indicator: [\r\n              { name: '销售', max: 16000 },\r\n              { name: '管理', max: 16000 },\r\n              { name: '运营', max: 16000 },\r\n              { name: '客服', max: 16000 },\r\n              { name: '研发', max: 16000 },\r\n              { name: '市场', max: 16000 }\r\n            ]\r\n          },\r\n          series: [\r\n            {\r\n              name: '预算 vs 开销（Budget vs spending）',\r\n              type: 'radar',\r\n              symbol: 'circle',\r\n              symbolSize: 10,\r\n              data: [\r\n                {\r\n                  value: res.data.budget,\r\n                  name: '预算分配（Allocated Budget）',\r\n                  areaStyle: {\r\n                    normal: {\r\n                      color: 'rgba(154, 116, 179, 0.7)'\r\n                    }\r\n                  },\r\n                  itemStyle: {\r\n                    color: 'rgba(154, 116, 179, 1)',\r\n                    borderColor: 'rgba(154, 116, 179, 0.3)',\r\n                    borderWidth: 10\r\n                  },\r\n                  lineStyle: {\r\n                    normal: {\r\n                      color: 'rgba(154, 116, 179, 1)',\r\n                      width: 2\r\n                    }\r\n                  }\r\n                },\r\n                {\r\n                  value: res.data.spending,\r\n                  name: '实际开销（Actual Spending）',\r\n                  areaStyle: {\r\n                    normal: {\r\n                      color: 'rgba(126, 237, 238, 0.7)'\r\n                    }\r\n                  },\r\n                  itemStyle: {\r\n                    color: 'rgba(126, 237, 238, 1)',\r\n                    borderColor: 'rgba(126, 237, 238, 0.3)',\r\n                    borderWidth: 10\r\n                  },\r\n                  lineStyle: {\r\n                    normal: {\r\n                      color: 'rgba(126, 237, 238, 1)',\r\n                      width: 2\r\n                    }\r\n                  }\r\n                }\r\n              ]\r\n            }\r\n          ]\r\n        })\r\n      })\r\n      return this\r\n    },\r\n    resizeChart () {\r\n      window.addEventListener('resize', () => {\r\n        this.chartPie.resize()\r\n        this.chartLine.resize()\r\n        this.chartBar.resize()\r\n        this.chartGauge.resize()\r\n        this.chartRadar.resize()\r\n      })\r\n    }\r\n  },\r\n  mounted () {\r\n    this.drawPie().drawLine().drawBar().drawGauge().drawRadar().resizeChart()\r\n  }\r\n}\r\n</script>\r\n\r\n<style scoped lang=\"less\">\r\n.el-row {\r\n  margin-top: 20px;\r\n}\r\n.chart {\r\n  width: 100%;\r\n  height: 330px;\r\n  .border-radius(8px);\r\n  background-color: @boxBgColor;\r\n  box-shadow: 0 0 5px transparent;\r\n  &:hover {\r\n    box-shadow: 0 0 5px @mainColor;\r\n  }\r\n}\r\n</style>\r\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!./EChartsSimple.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!./EChartsSimple.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./EChartsSimple.vue?vue&type=template&id=76e5b69b&scoped=true&\"\nimport script from \"./EChartsSimple.vue?vue&type=script&lang=js&\"\nexport * from \"./EChartsSimple.vue?vue&type=script&lang=js&\"\nimport style0 from \"./EChartsSimple.vue?vue&type=style&index=0&id=76e5b69b&scoped=true&lang=less&\"\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  \"76e5b69b\",\n  null\n  \n)\n\nexport default component.exports","export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--10-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.js??ref--10-oneOf-1-1!../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--10-oneOf-1-2!../../../node_modules/less-loader/dist/cjs.js??ref--10-oneOf-1-3!../../../node_modules/style-resources-loader/lib/index.js??ref--10-oneOf-1-4!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./EChartsSimple.vue?vue&type=style&index=0&id=76e5b69b&scoped=true&lang=less&\""],"sourceRoot":""}