TransFlow/node_modules/.cache/vue-loader/36cfe8179f51080ff2ef39b2270ea363.json

{"remainingRequest":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!E:\\视频边缘计算管理平台\\TransFlow\\src\\components\\chart\\avgChart.vue?vue&type=script&lang=js&","dependencies":[{"path":"E:\\视频边缘计算管理平台\\TransFlow\\src\\components\\chart\\avgChart.vue","mtime":1675934208139},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\babel-loader\\lib\\index.js","mtime":499162500000},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["//\n//\n//\n//\n\r\nexport default {\r\n    name: 'barChart', //均值图图组件\r\n    props: {\r\n        list: Array,\r\n        default() {\r\n            return [];\r\n        }\r\n    },\r\n    data() {\r\n        return {};\r\n    },\r\n    methods: {\r\n        drawBar(arr) {\r\n            let myChart = this.$echarts.getInstanceByDom(this.$refs.barChart)\r\n            if (myChart == null) {\r\n                myChart = this.$echarts.init(this.$refs.barChart)\r\n            }\r\n            let chartData = [{ stage: '值', number: 40 }];\r\n            let option = {\r\n                color: ['#0EECE4'],\r\n                tooltip: {\r\n                    // trigger: 'axis',\r\n                    confine: true\r\n                    // axisPointer: { // 坐标轴指示器，坐标轴触发有效\r\n                    //   type: 'line', // 默认为直线，可选为：'line' | 'shadow'\r\n                    //   lineStyle: {\r\n                    //     color: 'transparent',\r\n                    //   },\r\n                    // },\r\n                },\r\n                grid: {\r\n                    left: '0%',\r\n                    right: '0%',\r\n                    bottom: '10%',\r\n                    top: '15%',\r\n                    z: 22\r\n                },\r\n                xAxis: [\r\n                    {\r\n                        type: 'category',\r\n                        gridIndex: 0,\r\n                        data: chartData.map((item) => item.stage),\r\n                        axisLine: {\r\n                            show: false\r\n                        },\r\n                        axisLabel: {\r\n                            show: false\r\n                        }\r\n                    }\r\n                ],\r\n                yAxis: {\r\n                    type: 'value',\r\n                    splitArea: { show: false },\r\n                    gridIndex: 0,\r\n                    min: 0,\r\n                    splitNumber: 12,\r\n                    splitLine: {\r\n                        show: false\r\n                    },\r\n                    axisLine: {\r\n                        show: false\r\n                    },\r\n                    axisTick: {\r\n                        show: false\r\n                    },\r\n                    axisLabel: {\r\n                        show: false\r\n                    },\r\n                    max: 200\r\n                },\r\n                series: [\r\n                    {\r\n                        name: '平均值',\r\n                        type: 'bar',\r\n                        stack: 'val',\r\n                        barWidth: 150,\r\n                        xAxisIndex: 0,\r\n                        yAxisIndex: 0,\r\n                        label: {\r\n                            show: true,\r\n                            position: 'right',\r\n                            // align: 'right',\r\n                            distance: 15,\r\n                            color: '#000',\r\n                            fontSize: 17,\r\n                            formatter: '{c}' + '[avg]'\r\n                        },\r\n                        itemStyle: {\r\n                            color: '#DF8414'\r\n                        },\r\n                        data: [arr[arr.length-1].avg],\r\n                        zlevel: 11\r\n                    },\r\n                    {\r\n                        name: '中间值',\r\n                        type: 'bar',\r\n                        barWidth: 150,\r\n                        // xAxisIndex: 0,\r\n                        // yAxisIndex: 0,\r\n                        stack: 'val',\r\n                        label: {\r\n                            show: true,\r\n                            position: 'left',\r\n                            distance: 15,\r\n                            color: '#000',\r\n                            // align: 'left',\r\n                            fontSize: 17,\r\n                            formatter: '{c}' + '[med]',\r\n                            rich: {}\r\n                        },\r\n                        itemStyle: {\r\n                            color: '#0E76AF'\r\n                        },\r\n                        data: [arr[arr.length-1].med],\r\n                        zlevel: 11\r\n                    },\r\n                    {\r\n                        name: '最小值',\r\n                        type: 'bar',\r\n                        barWidth: 150,\r\n                        barGap: '-100%',\r\n                        data: [arr[arr.length-1].min],\r\n                        label: {\r\n                            show: true,\r\n                            position: 'bottom',\r\n                            distance: 10,\r\n                            color: '#000',\r\n                            fontSize: 17,\r\n                            formatter: '{c}' + '[min]'\r\n                        },\r\n                        tooltip: {\r\n                            backgroundColor: 'transparent',\r\n                            formatter: ' '\r\n                        },\r\n                        itemStyle: {\r\n                            color: '#ABA7A7'\r\n                        },\r\n                        zlevel: 9\r\n                    },\r\n                    {\r\n                        name: '最大值',\r\n                        type: 'bar',\r\n                        barWidth: 150,\r\n                        barGap: '-100%',\r\n                        data:[arr[arr.length-1].max],\r\n                        label: {\r\n                            show: true,\r\n                            position: 'top',\r\n                            distance: 15,\r\n                            color: '#000',\r\n                            fontSize: 17,\r\n                            formatter: '{c}' + '[max]'\r\n                        },\r\n                        tooltip: {\r\n                            backgroundColor: 'transparent',\r\n                            formatter: ' '\r\n                        },\r\n                        itemStyle: {\r\n                            color: '#ABA7A7'\r\n                        },\r\n                        zlevel: 9\r\n                    }\r\n                ]\r\n            };\r\n\r\n            myChart.setOption(option);\r\n            window.addEventListener('resize', function () {\r\n                myChart.resize();\r\n            });\r\n        }\r\n    },\r\n    mounted() {\r\n        \r\n    },\r\n    watch:{\r\n        list:{\r\n            handler(newVal){\r\n                if(newVal){\r\n                    this.drawBar(newVal);\r\n                }\r\n            }\r\n        }\r\n    }\r\n};\r\n",{"version":3,"sources":["avgChart.vue"],"names":[],"mappings":";;;;;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"avgChart.vue","sourceRoot":"src/components/chart","sourcesContent":["<template>\r\n    <div id=\"barChart\" ref=\"barChart\" style=\"width: 100%; height: 300px\"></div>\r\n</template>\r\n\r\n<script>\r\nexport default {\r\n    name: 'barChart', //均值图图组件\r\n    props: {\r\n        list: Array,\r\n        default() {\r\n            return [];\r\n        }\r\n    },\r\n    data() {\r\n        return {};\r\n    },\r\n    methods: {\r\n        drawBar(arr) {\r\n            let myChart = this.$echarts.getInstanceByDom(this.$refs.barChart)\r\n            if (myChart == null) {\r\n                myChart = this.$echarts.init(this.$refs.barChart)\r\n            }\r\n            let chartData = [{ stage: '值', number: 40 }];\r\n            let option = {\r\n                color: ['#0EECE4'],\r\n                tooltip: {\r\n                    // trigger: 'axis',\r\n                    confine: true\r\n                    // axisPointer: { // 坐标轴指示器，坐标轴触发有效\r\n                    //   type: 'line', // 默认为直线，可选为：'line' | 'shadow'\r\n                    //   lineStyle: {\r\n                    //     color: 'transparent',\r\n                    //   },\r\n                    // },\r\n                },\r\n                grid: {\r\n                    left: '0%',\r\n                    right: '0%',\r\n                    bottom: '10%',\r\n                    top: '15%',\r\n                    z: 22\r\n                },\r\n                xAxis: [\r\n                    {\r\n                        type: 'category',\r\n                        gridIndex: 0,\r\n                        data: chartData.map((item) => item.stage),\r\n                        axisLine: {\r\n                            show: false\r\n                        },\r\n                        axisLabel: {\r\n                            show: false\r\n                        }\r\n                    }\r\n                ],\r\n                yAxis: {\r\n                    type: 'value',\r\n                    splitArea: { show: false },\r\n                    gridIndex: 0,\r\n                    min: 0,\r\n                    splitNumber: 12,\r\n                    splitLine: {\r\n                        show: false\r\n                    },\r\n                    axisLine: {\r\n                        show: false\r\n                    },\r\n                    axisTick: {\r\n                        show: false\r\n                    },\r\n                    axisLabel: {\r\n                        show: false\r\n                    },\r\n                    max: 200\r\n                },\r\n                series: [\r\n                    {\r\n                        name: '平均值',\r\n                        type: 'bar',\r\n                        stack: 'val',\r\n                        barWidth: 150,\r\n                        xAxisIndex: 0,\r\n                        yAxisIndex: 0,\r\n                        label: {\r\n                            show: true,\r\n                            position: 'right',\r\n                            // align: 'right',\r\n                            distance: 15,\r\n                            color: '#000',\r\n                            fontSize: 17,\r\n                            formatter: '{c}' + '[avg]'\r\n                        },\r\n                        itemStyle: {\r\n                            color: '#DF8414'\r\n                        },\r\n                        data: [arr[arr.length-1].avg],\r\n                        zlevel: 11\r\n                    },\r\n                    {\r\n                        name: '中间值',\r\n                        type: 'bar',\r\n                        barWidth: 150,\r\n                        // xAxisIndex: 0,\r\n                        // yAxisIndex: 0,\r\n                        stack: 'val',\r\n                        label: {\r\n                            show: true,\r\n                            position: 'left',\r\n                            distance: 15,\r\n                            color: '#000',\r\n                            // align: 'left',\r\n                            fontSize: 17,\r\n                            formatter: '{c}' + '[med]',\r\n                            rich: {}\r\n                        },\r\n                        itemStyle: {\r\n                            color: '#0E76AF'\r\n                        },\r\n                        data: [arr[arr.length-1].med],\r\n                        zlevel: 11\r\n                    },\r\n                    {\r\n                        name: '最小值',\r\n                        type: 'bar',\r\n                        barWidth: 150,\r\n                        barGap: '-100%',\r\n                        data: [arr[arr.length-1].min],\r\n                        label: {\r\n                            show: true,\r\n                            position: 'bottom',\r\n                            distance: 10,\r\n                            color: '#000',\r\n                            fontSize: 17,\r\n                            formatter: '{c}' + '[min]'\r\n                        },\r\n                        tooltip: {\r\n                            backgroundColor: 'transparent',\r\n                            formatter: ' '\r\n                        },\r\n                        itemStyle: {\r\n                            color: '#ABA7A7'\r\n                        },\r\n                        zlevel: 9\r\n                    },\r\n                    {\r\n                        name: '最大值',\r\n                        type: 'bar',\r\n                        barWidth: 150,\r\n                        barGap: '-100%',\r\n                        data:[arr[arr.length-1].max],\r\n                        label: {\r\n                            show: true,\r\n                            position: 'top',\r\n                            distance: 15,\r\n                            color: '#000',\r\n                            fontSize: 17,\r\n                            formatter: '{c}' + '[max]'\r\n                        },\r\n                        tooltip: {\r\n                            backgroundColor: 'transparent',\r\n                            formatter: ' '\r\n                        },\r\n                        itemStyle: {\r\n                            color: '#ABA7A7'\r\n                        },\r\n                        zlevel: 9\r\n                    }\r\n                ]\r\n            };\r\n\r\n            myChart.setOption(option);\r\n            window.addEventListener('resize', function () {\r\n                myChart.resize();\r\n            });\r\n        }\r\n    },\r\n    mounted() {\r\n        \r\n    },\r\n    watch:{\r\n        list:{\r\n            handler(newVal){\r\n                if(newVal){\r\n                    this.drawBar(newVal);\r\n                }\r\n            }\r\n        }\r\n    }\r\n};\r\n</script>\r\n"]}]}