{"remainingRequest":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\babel-loader\\lib\\index.js!E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js??ref--0-0!E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!E:\\视频边缘计算管理平台\\TransFlow\\src\\components\\chart\\lineChart.vue?vue&type=script&lang=js&","dependencies":[{"path":"E:\\视频边缘计算管理平台\\TransFlow\\src\\components\\chart\\lineChart.vue","mtime":1677147569516},{"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":["import \"core-js/modules/es6.function.name\";\nimport \"core-js/modules/web.dom.iterable\";\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\nexport default {\n  name: 'lineChart',\n  //折线图组件\n  props: {\n    list: {\n      type: Array,\n      default: function _default() {\n        return [];\n      }\n    },\n    pageType: {\n      type: String\n    },\n    title: {\n      type: String\n    },\n    // 时间模式\n    status: {\n      type: String\n    },\n    // 组件名称\n    componentName: {\n      type: String\n    },\n    chartName: {\n      type: String\n    },\n    // 单个数据接收\n    typeValue: {\n      type: Object,\n      default: function _default() {\n        return {};\n      }\n    }\n  },\n  data: function data() {\n    return {\n      xData: [],\n      yData: [],\n      yData1: [],\n      yData2: [],\n      yData3: [],\n      arrN: [],\n      // series: []\n      // triggerType:'触发时刻'\n      myChart: null,\n      tooltip: {\n        show: true\n      },\n      series: [],\n      // \n      listArr: []\n    };\n  },\n  created: function created() {// console.log( this.componentName + '-' + this.chartName + '-' + '曲线图','40');\n  },\n  methods: {\n    drawLine: function drawLine(newVal, title) {\n      var myChart = this.$echarts.getInstanceByDom(this.$refs.lineChart);\n\n      if (myChart == null) {\n        myChart = this.$echarts.init(this.$refs.lineChart);\n      } // var series = []\n      // myChart.showLoading()　　//开启loading\n\n\n      var option = {\n        legend: {},\n        grid: {\n          left: '2%',\n          right: '4%',\n          bottom: '10%',\n          top: '20%',\n          containLabel: true\n        },\n        tooltip: this.tooltip,\n        xAxis: [{\n          type: 'category',\n          axisLine: {\n            show: true,\n            lineStyle: {\n              color: '#eeebeb',\n              type: 'dashed'\n            }\n          },\n          axisTick: {\n            show: false\n          },\n          axisLabel: {\n            color: '#6c6c6c'\n          },\n          splitLine: {\n            show: false\n          },\n          boundaryGap: ['5%', '5%'],\n          data: this.xData\n        }],\n        yAxis: [{\n          type: 'value',\n          axisLabel: {\n            color: '#6c6c6c'\n          },\n          splitLine: {\n            lineStyle: {\n              color: '#eeebeb',\n              type: 'dashed'\n            }\n          },\n          axisLine: {\n            show: false\n          },\n          axisTick: {\n            show: false\n          }\n        }],\n        series: this.getMessage(newVal, title)\n      };\n      myChart.setOption(option);\n      window.addEventListener('resize', function () {\n        myChart.resize();\n      });\n    },\n    getMessage: function getMessage(newVal, title) {\n      this.xData = newVal.map(function (val) {\n        return val.time;\n      });\n      var series = [{\n        name: '',\n        type: 'line',\n        symbolSize: 6,\n        smooth: true,\n        itemStyle: {\n          color: '#fb864b',\n          borderColor: '#fb864b' // borderWidth: 2\n\n        },\n        data: []\n      }];\n\n      if (title === '类型') {\n        this.tooltip = {\n          formatter: '{a} {b}:{c}个',\n          show: true,\n          confine: true\n        };\n        series[0].name = '总量'; // 映射出类型数组\n\n        var arr = newVal.map(function (ele) {\n          if (ele.type_data != null) {\n            return ele.type_data;\n          }\n        });\n        var mapN = [];\n\n        for (var t = 0; t < arr.length; t++) {\n          for (var i = 0; i < arr[t].length; i++) {\n            mapN.push(arr[t][i]);\n          }\n        }\n\n        var lineArr = [];\n\n        if (newVal[0].type_data != undefined) {\n          newVal[0].type_data.forEach(function (ele) {\n            lineArr.push({\n              name: ele.name,\n              type: 'line',\n              data: [],\n              smooth: true\n            });\n          });\n        }\n\n        mapN.forEach(function (ele) {\n          if (ele.name == '机动车') {\n            lineArr[0].data.push(ele.quantity);\n          } else if (ele.name == '非机动车') {\n            lineArr[1].data.push(ele.quantity);\n          } else {\n            lineArr[2].data.push(ele.quantity);\n          }\n        });\n\n        for (var j = 0; j < lineArr.length; j++) {\n          series.push(lineArr[j]);\n        } // 总和数量\n\n\n        var mapNR1 = [];\n        newVal.map(function (ele) {\n          if (ele.type_data != null) {\n            var sum = ele.type_data.reduce(function (prev, cur) {\n              return cur.quantity + prev;\n            }, 0);\n            mapNR1.push(sum);\n          }\n        });\n        series[0].data = mapNR1;\n      } else if (title === '速度') {\n        this.tooltip = {\n          formatter: '{a} {b}:{c}km/h',\n          show: true,\n          confine: true\n        }; // console.log(\"newVal\",newVal)\n\n        series[0].data = newVal.map(function (val) {\n          return val.speed;\n        });\n      } else if (title === '流量') {\n        series[0].data = newVal.map(function (ele) {\n          return ele.in_flow + ele.out_flow;\n        });\n      } else if (title === '车头时距') {\n        this.tooltip = {\n          formatter: '{a} {b}:{c}/s',\n          show: true,\n          confine: true\n        };\n        series[0].data = newVal.map(function (val) {\n          return val.headway;\n        });\n      } else if (title === '排队数') {\n        series[0].data = newVal.map(function (val) {\n          return val.n_queue;\n        });\n      } else if (title === '检测数') {\n        series[0].data = newVal.map(function (val) {\n          return val.n_stay;\n        });\n      } else if (title === '延误') {\n        series[0].data = newVal.map(function (val) {\n          return val.ave_delay;\n        });\n      } else if (title === '拥堵') {\n        series[0].data = newVal.map(function (val) {});\n      }\n\n      console.log(series, '折线图数据');\n      return series;\n    }\n  },\n  mounted: function mounted() {// this.drawLine();\n    // this.getMessage(this.list)\n    // console.log(this.$parent.dataArr, '父组件的dataArr');\n    // this.$set(this.$parent.dataArr)\n  },\n  computed: {\n    listTotal: function listTotal() {\n      return JSON.parse(JSON.stringify(this.$parent.dataArr));\n    }\n  },\n  watch: {\n    listTotal: {\n      // handler(newVal){\n      //     console.log(this.chartName , newVal,'数据');\n      // },\n      deep: true\n    }\n  }\n};",{"version":3,"sources":["lineChart.vue"],"names":[],"mappings":"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","sourcesContent":["<template>\r\n    <div style=\"width: 100%;margin-top: 5px;\">\r\n        <div class=\"tableTitle\">\r\n            <div>\r\n                <span\r\n                    style=\"width: 10px;height:10px;border-radius: 50%;background-color: #3297ff;display: inline-block;vertical-align: middle;margin-right: 8px;\"></span>\r\n                <span style=\"font-size:18px;\">{{ this.componentName + '-' + this.chartName + '-' + '曲线图' + '-' + status,\r\n                                    }}</span>\r\n            </div>\r\n        </div>\r\n        <div id=\"lineChart\" ref=\"lineChart\" style=\"width: 100%; height: 300px\"></div>\r\n    </div>\r\n</template>\r\n\r\n<script>\r\nexport default {\r\n    name: 'lineChart', //折线图组件\r\n    props: {\r\n        list: {\r\n            type: Array,\r\n            default() {\r\n                return [];\r\n            }\r\n        },\r\n        pageType: {\r\n            type: String\r\n        },\r\n        title: {\r\n            type: String\r\n        },\r\n        // 时间模式\r\n        status: {\r\n            type: String\r\n        },\r\n        // 组件名称\r\n        componentName: {\r\n            type: String\r\n        },\r\n        chartName: {\r\n            type: String\r\n        },\r\n        // 单个数据接收\r\n        typeValue: {\r\n            type: Object,\r\n            default() {\r\n                return {};\r\n            }\r\n        }\r\n    },\r\n    data() {\r\n        return {\r\n            xData: [],\r\n            yData: [],\r\n            yData1: [],\r\n            yData2: [],\r\n            yData3: [],\r\n            arrN: [],\r\n            // series: []\r\n            // triggerType:'触发时刻'\r\n            myChart: null,\r\n            tooltip: {\r\n                show: true\r\n            },\r\n            series: [],\r\n\r\n            // \r\n            listArr: []\r\n        };\r\n    },\r\n    created() {\r\n        // console.log( this.componentName + '-' + this.chartName + '-' + '曲线图','40');\r\n\r\n    },\r\n\r\n    methods: {\r\n        drawLine(newVal, title) {\r\n            let myChart = this.$echarts.getInstanceByDom(this.$refs.lineChart);\r\n            if (myChart == null) {\r\n                myChart = this.$echarts.init(this.$refs.lineChart);\r\n            }\r\n            // var series = []\r\n\r\n            \r\n\r\n\r\n            // myChart.showLoading()　　//开启loading\r\n            let option = {\r\n                legend: {},\r\n                grid: {\r\n                    left: '2%',\r\n                    right: '4%',\r\n                    bottom: '10%',\r\n                    top: '20%',\r\n                    containLabel: true\r\n                },\r\n                tooltip: this.tooltip,\r\n                xAxis: [\r\n                    {\r\n                        type: 'category',\r\n                        axisLine: {\r\n                            show: true,\r\n                            lineStyle: {\r\n                                color: '#eeebeb',\r\n                                type: 'dashed'\r\n                            }\r\n                        },\r\n                        axisTick: {\r\n                            show: false\r\n                        },\r\n                        axisLabel: {\r\n                            color: '#6c6c6c'\r\n                        },\r\n                        splitLine: {\r\n                            show: false\r\n                        },\r\n                        boundaryGap: ['5%', '5%'],\r\n\r\n                        data: this.xData\r\n                    }\r\n                ],\r\n                yAxis: [\r\n                    {\r\n                        type: 'value',\r\n                        axisLabel: {\r\n                            color: '#6c6c6c'\r\n                        },\r\n                        splitLine: {\r\n                            lineStyle: {\r\n                                color: '#eeebeb',\r\n                                type: 'dashed'\r\n                            }\r\n                        },\r\n                        axisLine: {\r\n                            show: false\r\n                        },\r\n                        axisTick: {\r\n                            show: false\r\n                        }\r\n                    }\r\n                ],\r\n                series: this.getMessage(newVal, title)\r\n            };\r\n            myChart.setOption(option)\r\n\r\n            window.addEventListener('resize', function () {\r\n                myChart.resize();\r\n            });\r\n        },\r\n\r\n        getMessage(newVal, title) {\r\n            this.xData = newVal.map(val => {\r\n                return val.time;\r\n            });\r\n\r\n            var series = [\r\n                {\r\n                    name: '',\r\n                    type: 'line',\r\n                    symbolSize: 6,\r\n                    smooth: true,\r\n                    itemStyle: {\r\n                        color: '#fb864b',\r\n                        borderColor: '#fb864b'\r\n                        // borderWidth: 2\r\n                    },\r\n                    data: []\r\n                }\r\n            ];\r\n\r\n            if (title === '类型') {\r\n                this.tooltip = {\r\n                    formatter: '{a} {b}:{c}个',\r\n                    show: true,\r\n                    confine: true\r\n                };\r\n                series[0].name = '总量';\r\n                // 映射出类型数组\r\n                let arr = newVal.map(function (ele) {\r\n                    if (ele.type_data != null) {\r\n                        return ele.type_data;\r\n                    }\r\n                });\r\n                var mapN = [];\r\n                for (var t = 0; t < arr.length; t++) {\r\n                    for (var i = 0; i < arr[t].length; i++) {\r\n                        mapN.push(arr[t][i]);\r\n                    }\r\n                }\r\n                var lineArr = []\r\n                if (newVal[0].type_data != undefined) {\r\n                    newVal[0].type_data.forEach(ele => {\r\n                        lineArr.push({\r\n                            name: ele.name,\r\n                            type: 'line',\r\n                            data: [],\r\n                            smooth: true\r\n                        });\r\n                    });\r\n                }\r\n                mapN.forEach(ele => {\r\n                    if (ele.name == '机动车') {\r\n                        lineArr[0].data.push(ele.quantity);\r\n                    } else if (ele.name == '非机动车') {\r\n                        lineArr[1].data.push(ele.quantity);\r\n                    } else {\r\n                        lineArr[2].data.push(ele.quantity);\r\n                    }\r\n                });\r\n                for (let j = 0; j < lineArr.length; j++) {\r\n                    series.push(lineArr[j]);\r\n                }\r\n                // 总和数量\r\n                let mapNR1 = [];\r\n                newVal.map(function (ele) {\r\n                    if (ele.type_data != null) {\r\n                        var sum = ele.type_data.reduce(function (prev, cur) {\r\n                            return cur.quantity + prev;\r\n                        }, 0);\r\n                        mapNR1.push(sum);\r\n                    }\r\n                });\r\n                series[0].data = mapNR1;\r\n            } else if (title === '速度') {\r\n                this.tooltip = {\r\n                    formatter: '{a} {b}:{c}km/h',\r\n                    show: true,\r\n                    confine: true\r\n                };\r\n                // console.log(\"newVal\",newVal)\r\n                series[0].data = newVal.map(val => {\r\n                    return val.speed;\r\n                });\r\n            } else if (title === '流量') {\r\n                series[0].data = newVal.map(ele => {\r\n                    return ele.in_flow + ele.out_flow;\r\n                });\r\n            } else if (title === '车头时距') {\r\n                this.tooltip = {\r\n                    formatter: '{a} {b}:{c}/s',\r\n                    show: true,\r\n                    confine: true\r\n                };\r\n                series[0].data = newVal.map(val => {\r\n                    return val.headway;\r\n                });\r\n            } else if (title === '排队数') {\r\n                series[0].data = newVal.map(val => {\r\n                    return val.n_queue;\r\n                });\r\n            } else if (title === '检测数') {\r\n                series[0].data = newVal.map(val => {\r\n                    return val.n_stay;\r\n                });\r\n            } else if (title === '延误') {\r\n                series[0].data = newVal.map(val => {\r\n                    return val.ave_delay;\r\n                });\r\n            } else if (title === '拥堵') {\r\n                series[0].data = newVal.map(val => { });\r\n            }\r\n            console.log(series,'折线图数据');\r\n            return series\r\n        }\r\n    },\r\n    mounted() {\r\n        // this.drawLine();\r\n        // this.getMessage(this.list)\r\n        // console.log(this.$parent.dataArr, '父组件的dataArr');\r\n        // this.$set(this.$parent.dataArr)\r\n    },\r\n    computed: {\r\n        listTotal() {\r\n            return JSON.parse(JSON.stringify(this.$parent.dataArr))\r\n        }\r\n    },\r\n    watch: {\r\n        listTotal: {\r\n            // handler(newVal){\r\n            //     console.log(this.chartName , newVal,'数据');\r\n            // },\r\n\r\n            deep: true\r\n        },\r\n\r\n\r\n    }\r\n};\r\n</script>\r\n<style scoped>\r\n.tableTitle {\r\n    background: #f7f8fa;\r\n    margin-bottom: 5px;\r\n    padding: 8px;\r\n}\r\n</style>\r\n"],"sourceRoot":"src/components/chart"}]}