{"version":3,"sources":["webpack:///./src/pages/statistical/components/bin-echarts.vue?655f","webpack:///src/pages/statistical/components/bin-echarts.vue","webpack:///./src/pages/statistical/components/bin-echarts.vue?e677","webpack:///./src/pages/statistical/components/bin-echarts.vue?33fd","webpack:///./src/pages/statistical/components/bin-echarts.vue?98c0"],"names":["render","_vm","this","_h","$createElement","_c","_self","ref","attrs","staticRenderFns","name","props","currentIndex","type","Number","default","data","myChart","options","tooltip","trigger","title","color","series","number","mounted","$nextTick","watch","handler","setOption","newVal","length","text","value","dispatchAction","deep","immediate","methods","initEcharts","on","param","dataIndex","setHightLight","console","log","setTimeout","changeHightLight","component"],"mappings":"iJAAA,IAAIA,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,MAAM,CAACA,EAAG,MAAM,CAACE,IAAI,YAAYC,MAAM,CAAC,GAAK,mBAC5IC,EAAkB,G,iCCQtB,GACEC,KAAM,cACNC,MAAO,CACLC,aAAc,CACZC,KAAMC,OACNC,QAAS,IAGbC,KARF,WASI,MAAO,CACLC,QAAS,KACTC,QAAS,CACPC,QAAS,CACPC,QAAS,QASXC,MAAO,CACf,CACU,KAAV,GACU,IAAV,SACU,KAAV,SACU,UAAV,CACY,SAAZ,GACY,WAAZ,OACY,MAAZ,aAIQC,MAAO,CAAC,UAAW,UAAW,UAAW,UAAW,UAAW,WAC/DC,OAAQ,CAChB,CACU,KAAV,KACU,KAAV,MACU,OAAV,cACU,mBAAV,EACU,UAAV,CACY,aAAZ,GACY,YAAZ,OACY,YAAZ,GAEU,MAAV,CACY,MAAZ,GAEU,UAAV,CACY,MAAZ,GAEU,KAAV,MAIMC,OAAQ,IAGZC,QA3DF,WA2DA,WACIvB,KAAKwB,WAAU,WACb,EAAN,kBAGEC,MAAO,CACLT,QAAS,CACPU,QADN,SACA,GAEQ1B,KAAKe,QAAQY,UAAU3B,KAAKgB,SACxBY,EAAOP,QAAUO,EAAOP,OAAOQ,QAAUD,EAAOP,OAAO,GAAGP,MAAQc,EAAOP,OAAO,GAAGP,KAAKe,QAC1F7B,KAAKgB,QAAQG,MAAM,GAAGW,KAAOF,EAAOP,OAAO,GAAGP,KAAKd,KAAKsB,QAAQS,MAChE/B,KAAKe,QAAQiB,eAAe,CAAtC,2CAEUhC,KAAKsB,OAAS,EACdtB,KAAKgB,QAAQG,MAAM,GAAGW,KAAO,KAGjCG,MAAM,EACNC,WAAW,IAGfC,QAAS,CACPC,YADJ,WACA,WACA,uBACMpC,KAAKe,QAAU,EAArB,UACMf,KAAKe,QAAQY,UAAU3B,KAAKgB,SAC5BhB,KAAKe,QAAQsB,GAAG,SAAS,SAA/B,GACQ,EAAR,8BACQ,EAAR,iEACYC,EAAMC,YAAc,EAAhC,QACU,EAAV,6DAEQ,EAAR,mBACQ,EAAR,iCAEMvC,KAAKwC,iBAGPA,cAjBJ,WAiBA,WACMC,QAAQC,IAAI1C,KAAKsB,QACjBtB,KAAKsB,OAAS,EACdqB,YAAW,WACT,EAAR,0CACQ,EAAR,uDACY,EAAZ,wDACU,EAAV,wDAEU,EAAV,2BAEA,MAEIC,iBA9BJ,WA8BA,WACM5C,KAAKU,aAAeV,KAAKU,aAAe,EAAI,EAAIV,KAAKU,aACrDiC,YAAW,WACT,EAAR,0CACQ,EAAR,oEACY,EAAZ,wDACU,EAAV,qEAEU,EAAV,yBAEQ,EAAR,wBACA,QCnImX,I,wBCQ/WE,EAAY,eACd,EACA/C,EACAS,GACA,EACA,KACA,WACA,MAIa,aAAAsC,E,kECnBf,yBAA8gB,EAAG","file":"js/pages-statistical-components-bin-echarts.3f23f7ad.js","sourcesContent":["var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[_c('div',{ref:\"binCharts\",attrs:{\"id\":\"bin-charts\"}})])}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div>\n    <div ref=\"binCharts\" id=\"bin-charts\"></div>\n  </div>\n</template>\n\n<script>\nimport echarts from \"echarts\";\n\nexport default {\n  name: \"bin-echarts\",\n  props: {\n    currentIndex: {\n      type: Number,\n      default: 0\n    },\n  },\n  data() {\n    return {\n      myChart: null,\n      options: {\n        tooltip: {\n          trigger: 'item'\n        },\n        // legend: {\n        //   top: 'bottom',\n        //   left: 'center',\n        //   icon: 'circle', // 形状\n        //   itemWidth: 10, // 宽\n        //   itemHeight: 10// 高\n        // },\n        title: [\n          {\n            text: \"\",\n            top: 'center',\n            left: 'center',\n            textStyle: {\n              fontSize: 28,\n              fontWeight: 'bold',\n              color: '#333333'\n            }\n          }\n        ],\n        color: [\"#23B899\", \"#FFB844\", \"#FF5FA3\", \"#8E8CFF\", \"#57CBCB\", \"#1890FF\"],\n        series: [\n          {\n            name: '数量',\n            type: 'pie',\n            radius: ['55%', '70%'],\n            avoidLabelOverlap: true,\n            itemStyle: {\n              borderRadius: 10,\n              borderColor: '#fff',\n              borderWidth: 2\n            },\n            label: {\n              show: false\n            },\n            labelLine: {\n              show: false\n            },\n            data: []\n          }\n        ]\n      },\n      number: 0,\n    }\n  },\n  mounted() {\n    this.$nextTick(() => {\n      this.initEcharts()\n    })\n  },\n  watch: {\n    options: {\n      handler(newVal) {\n        // this.myChart.clear();\n        this.myChart.setOption(this.options);\n        if (newVal.series && newVal.series.length && newVal.series[0].data && newVal.series[0].data.length) {\n          this.options.title[0].text = newVal.series[0].data[this.number].value\n          this.myChart.dispatchAction({type: 'highlight', dataIndex: this.number});\n        } else {\n          this.number = 0\n          this.options.title[0].text = \"\"\n        }\n      },\n      deep: true,\n      immediate: false\n    }\n  },\n  methods: {\n    initEcharts() {\n      let mapDiv = this.$refs.binCharts;\n      this.myChart = echarts.init(mapDiv);\n      this.myChart.setOption(this.options);\n      this.myChart.on('click', (param) => { //添加点击事件\n        this.options.title[0].text = param.value\n        this.myChart.dispatchAction({type: 'highlight', dataIndex: param.dataIndex}); //激活点击区域高亮\n        if (param.dataIndex !== this.number) { // 当鼠标点击的时候 消除上一个扇区的高亮\n          this.myChart.dispatchAction({type: 'downplay', dataIndex: this.number});\n        }\n        this.number = param.dataIndex //接住当前扇区的dataIndex\n        this.$emit('clickNum', param.dataIndex)\n      });\n      this.setHightLight()\n    },\n    // 设置默认高亮显示\n    setHightLight() {\n      console.log(this.number);\n      this.number = 0\n      setTimeout(() => {\n        this.myChart.dispatchAction({type: 'downplay'});\n        this.myChart.dispatchAction({type: 'highlight', dataIndex: 0});\n        if (this.options.series[0].data && this.options.series[0].data.length) {\n          this.options.title[0].text = this.options.series[0].data[0].value\n        } else {\n          this.options.title[0].text = ''\n        }\n      }, 1000)\n    },\n    changeHightLight(){\n      this.currentIndex = this.currentIndex > 5 ? 5 : this.currentIndex\n      setTimeout(() => {\n        this.myChart.dispatchAction({type: 'downplay'});\n        this.myChart.dispatchAction({type: 'highlight', dataIndex: this.currentIndex});\n        if (this.options.series[0].data && this.options.series[0].data.length) {\n          this.options.title[0].text = this.options.series[0].data[this.currentIndex].value\n        } else {\n          this.options.title[0].text = ''\n        }\n        this.number = this.currentIndex\n      }, 100)\n    },\n  }\n}\n</script>\n\n<style scoped>\n#bin-charts {\n  width: 100%;\n  height: calc(48vh - 180px) !important;\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!./bin-echarts.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!./bin-echarts.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./bin-echarts.vue?vue&type=template&id=4bbce086&scoped=true&\"\nimport script from \"./bin-echarts.vue?vue&type=script&lang=js&\"\nexport * from \"./bin-echarts.vue?vue&type=script&lang=js&\"\nimport style0 from \"./bin-echarts.vue?vue&type=style&index=0&id=4bbce086&scoped=true&lang=css&\"\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  \"4bbce086\",\n  null\n  \n)\n\nexport default component.exports","import mod from \"-!../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../../../node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-2!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./bin-echarts.vue?vue&type=style&index=0&id=4bbce086&scoped=true&lang=css&\"; export default mod; export * from \"-!../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../../../node_modules/css-loader/dist/cjs.js??ref--6-oneOf-1-1!../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-2!../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./bin-echarts.vue?vue&type=style&index=0&id=4bbce086&scoped=true&lang=css&\""],"sourceRoot":""}