{"remainingRequest":"D:\\jenkins\\workspace\\xq-web-fvue\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\jenkins\\workspace\\xq-web-fvue\\src\\components\\charts\\CloumnBarChart.vue?vue&type=script&lang=js&","dependencies":[{"path":"D:\\jenkins\\workspace\\xq-web-fvue\\src\\components\\charts\\CloumnBarChart.vue","mtime":1667327528903},{"path":"D:\\jenkins\\workspace\\xq-web-fvue\\node_modules\\babel-loader\\lib\\index.js","mtime":315532800000},{"path":"D:\\jenkins\\workspace\\xq-web-fvue\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\xq-web-fvue\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["//\n//\n//\n//\n//\n//\n\r\nimport * as echarts from 'echarts'\r\nexport default {\r\n mounted() {\r\n this.draw()\r\n },\r\n methods: {\r\n draw() {\r\n var chartDom = document.getElementById('mainCloumnBar')\r\n var myChart = echarts.init(chartDom)\r\n var option\r\n\r\n option = {\r\n legend: {\r\n top: 'bottom',\r\n padding: 20\r\n },\r\n tooltip: false,\r\n color: [\r\n '#9489fa',\r\n '#f06464',\r\n '#f7af59',\r\n '#f0da49',\r\n '#71c16f',\r\n '#2aaaef',\r\n '#5690dd',\r\n '#bd88f5',\r\n '#009db2',\r\n '#024b51',\r\n '#0780cf',\r\n '#765005'\r\n ],\r\n series: [\r\n {\r\n type: 'pie',\r\n radius: ['50%', '70%'],\r\n avoidLabelOverlap: false,\r\n itemStyle: {\r\n borderRadius: 10,\r\n borderColor: '#fff',\r\n borderWidth: 2\r\n },\r\n label: {\r\n show: false,\r\n fontSize: '20',\r\n fontWeight: 'bold',\r\n position: 'center',\r\n textStyle: {\r\n color: '#5690dd'\r\n },\r\n formatter: '{b}\\n\\n {c}元 \\n\\n 占比{d}%'\r\n },\r\n emphasis: {\r\n itemStyle: {\r\n shadowBlur: 10,\r\n shadowColor: 'rgba(0,0,0,0.3)'\r\n },\r\n label: {\r\n show: true,\r\n fontSize: '20',\r\n fontWeight: 'bold',\r\n textStyle: {\r\n color: '#5690dd'\r\n },\r\n formatter: '{b}\\n\\n {c}元 \\n\\n 占比{d}%'\r\n }\r\n },\r\n labelLine: {\r\n show: false\r\n },\r\n data: [\r\n {value: 3424553, name: '工程类合同'},\r\n {value: 3532343, name: '技术类合同'},\r\n {value: 5322283, name: '服务类合同'},\r\n {value: 3332115, name: '采购类合同'},\r\n {value: 4423344, name: '配套类合同'}\r\n ]\r\n }\r\n ]\r\n }\r\n\r\n option && myChart.setOption(option)\r\n myChart.dispatchAction({type: 'highlight', dataIndex: 0}) // dataIndex属性伟data传入的索引值\r\n myChart.dispatchAction({\r\n type: 'showTip',\r\n seriesIndex: 0,\r\n position: [120, 220],\r\n dataIndex: 0\r\n }) // 点击生成detip工具条位置\r\n let index\r\n myChart.on('mouseover', e => {\r\n if (e.dataIndex !== 0) {\r\n // 当鼠标移除的时候 使默认的索引值去除默认选中\r\n myChart.dispatchAction({type: 'downplay', dataIndex: 0})\r\n }\r\n })\r\n // myChart.on(\"mouseout\", function(e) {\r\n // index = e.dataIndex\r\n // myChart.dispatchAction({\r\n // type: \"highlight\",\r\n // dataIndex: e.dataIndex\r\n // });\r\n // });\r\n }\r\n }\r\n}\r\n",null]}