TransFlow/node_modules/.cache/vue-loader/226cebbd4a65f0a77cc251f5b9ca8735.json

{"remainingRequest":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!E:\\视频边缘计算管理平台\\TransFlow\\src\\components\\chart\\chart.vue?vue&type=style&index=0&id=2bbf1e0d&scoped=true&lang=css&","dependencies":[{"path":"E:\\视频边缘计算管理平台\\TransFlow\\src\\components\\chart\\chart.vue","mtime":1664169476000},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\css-loader\\dist\\cjs.js","mtime":1672206976118},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\vue-loader\\lib\\loaders\\stylePostLoader.js","mtime":1672206979280},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\postcss-loader\\src\\index.js","mtime":1672206978495},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\cache-loader\\dist\\cjs.js","mtime":1672206975777},{"path":"E:\\视频边缘计算管理平台\\TransFlow\\node_modules\\vue-loader\\lib\\index.js","mtime":1672206979279}],"contextDependencies":[],"result":["\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n#batchEcharts{\n   width: 90%;\n          height: 95%;\n}\n",{"version":3,"sources":["chart.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0WA;AACA;AACA;AACA","file":"chart.vue","sourceRoot":"src/components/chart","sourcesContent":["<template>\n    <div id=\"batchEcharts\" ></div>\n</template>\n\n<script>\nexport default {\nname: \"echarsDemo\",\n props: {\n  ydata: {\n      default: () => false,\n            type: [Array, Boolean],\n            required: true\n    },\n    ydata1: {\n      default: () => false,\n            type: [Array, Boolean],\n            required: true\n    },\n  xdata: {\n      default: () => false,\n            type: [Array, Boolean],\n            required: true\n    },\n    \n  },\n  data(){\n  return{\n\n  };\n  },\n  watch:{\n    ydata:{\n      handler:function(newV){\n        console.log(\"newV\",newV)\n         this.getLoadEcharts()\n      }\n    },\n     ydata1:{\n      handler:function(newV){\n        console.log(\"newV\",newV)\n         this.getLoadEcharts()\n      }\n    },\n    xdata:{\n      handler:function(newV1){\n         console.log(\"newV1\",newV1)\n         this.getLoadEcharts()\n      }\n    }\n  },\n  mounted() {\n  this.getLoadEcharts()\n  console.log(\"111\",this.xdata);\n   console.log(\"222\",this.ydata);\n  },\n  methods:{\n    getLoadEcharts() {\n      var myChart = this.$echarts.init(document.getElementById(\"batchEcharts\"));\n      //     let value = [5, 7, 8, 9, 10, 11, 13, 15, 16, 14, 13, 12, 8, 6, 5, 4, 5, 6, 7, 8, 10, 11, 10, 8,12,13,9,6];\n      //    let min = Math.min(...value); //计算最小值\n      //    let max = Math.max(...value); //计算最大值\n      var option = {\n        tooltip: {\n          trigger: \"axis\",\n        },\n        color: [\"#52F478\"],\n        icon: \"circle\",\n        //   legend: {\n        //     x:'580px',\n        //     y: '30px',\n        //     data: [{\n        //       name: '月',\n        //       icon:'none'\n        //     },\n        //       {\n        //         name: '日',\n        //          icon:'none'\n        //       }],\n        //     textStyle:{\n        //       fontSize: 14,//字体大小\n        //       color: '#BBF6FF',//字体颜色\n\n        //     },\n        //     selectedMode: 'single',\n        //   },\n        grid: {\n          // top: \"10px\",\n          left: \"6%\", //默认10%\n          right: \"10%\", //默认10%\n          bottom: \"8%\", //默认60\n          containLabel: true,\n        },\n        xAxis: {\n          type: \"category\",\n          name: \"\",\n          nameGap: \"16\",\n          show: true,\n          boundaryGap: \"1%\",\n          offset: 25,\n          axisLabel: {\n            textStyle: {\n              color: \"#FFFFFF\",\n            },\n          },\n          axisTick: {\n            show: false,\n          },\n          splitArea: {\n            show: false,\n          },\n          splitLine: {\n            show: false,\n          },\n          axisLine: {\n            show: false,\n            lineStyle: {\n              color: \"#BBF6FF\",\n              width: 2,\n            },\n            symbol: [\"none\", \"arrow\"],\n          },\n          // data: [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28],\n          data:this.xdata\n        },\n        yAxis: [{\n          type: \"value\",\n          name: \"单位: 分钟\",\n          show: true,\n          offset: 48,\n          id:0,\n          nameTextStyle: {\n            color: \"#ffffff\",\n            padding: [0, -15, 15, 0],\n            // verticalAlign: 'top'\n            align: \"right\",\n          },\n          axisLabel: {\n            textStyle: {\n              color: \"#ffffff\",\n            },\n          },\n          axisTick: {\n            //y轴刻度线\n            show: false,\n          },\n          splitArea: {\n            show: false,\n          },\n          splitLine: {\n            show: true,\n            lineStyle: {\n              color: \"rgb(13,190,196)\",\n              width: 1,\n              type: \"dashed\",\n            },\n          },\n          axisLine: {\n            show: false,\n            lineStyle: {\n              color: \"rgb(8,99,116)\",\n              width: 1,\n            },\n            symbol: [\"none\", \"arrow\"],\n          },\n        },{\n           type: \"value\",\n          name: \"单位: Kg\",\n          show: true,\n          offset: 30,\n          id:1,\n          nameTextStyle: {\n            color: \"#ffffff\",\n            padding: [0, -40, 15, 0],\n            // verticalAlign: 'top'\n            align: \"right\",\n          },\n          axisLabel: {\n            textStyle: {\n              color: \"#ffffff\",\n            },\n          },\n          axisTick: {\n            //y轴刻度线\n            show: false,\n          },\n          splitArea: {\n            show: false,\n          },\n          splitLine: {\n            show: true,\n            lineStyle: {\n              color: \"rgb(13,190,196)\",\n              width: 1,\n              type: \"dashed\",\n            },\n          },\n          axisLine: {\n            show: false,\n            lineStyle: {\n              color: \"rgb(8,99,116)\",\n              width: 1,\n            },\n            symbol: [\"none\", \"arrow\"],\n          },\n        }\n        ],\n        series: [\n                   {\n            name: \"单位: 分钟\",\n            type: \"line\",\n            smooth: true,\n            // symbol: \"rect\",\n            // symbolSize: 10,\n            yAxisIndex:0,\n            lineStyle: {\n              normal: {\n                color: \"#4EEE79\",\n                width: 3,\n              },\n            },\n            // areaStyle: {\n            //   normal: {\n            //     color: new this.$echarts.graphic.LinearGradient(0, 1, 0, 0, [\n            //       {\n            //         offset: 0,\n            //         color: \"rgb(9,84,88)\",\n            //       },\n            //       {\n            //         offset: 1,\n            //         color: \"rgb(9,71,72)\",\n            //       },\n            //     ]),\n            //   },\n            // },\n            // data: [3666, 2666, 1666, 234, 250, 899, 1200, 900, 2000, 666, 999,3666, 2666, 1666, 234, 250, 899, 1200, 900, 2000, 666, 999,1200, 900, 2000, 666, 999],\n            data:this.ydata1,\n            // markPoint: {\n            //   data: [{ type: \"max\", name: \"最大值\" }],\n            // },\n            // symbol: function (value, params) {\n            //   if (value == min || value == max) {\n            //     return \"circle\"; //拐点类型\n            //   } else {\n            //     return \"none\"; //拐点不显示\n            //   }\n            // },\n            markPoint: {\n              show: false,\n            },\n            itemStyle: {\n              normal: {\n                color: \"#52F478\",\n                borderColor: \"#52F478\", //拐点边框颜色\n\n                lineStyle: {\n                  color: \"#52F478\", //折线颜色\n                },\n                label: { show: false, color: \"#ffffff\" },\n              },\n            },\n          },\n            {\n            name: \"单位:kg\",\n            type: \"line\",\n            smooth: true,\n            stack: 'Total',\n            yAxisIndex:1,\n            // symbol: \"rect\",\n            // symbolSize: 10,\n            // lineStyle: {\n            //   normal: {\n            //     color: \"rgb(4,252,254)\",\n            //     width: 3,\n            //   },\n            // },\n             itemStyle: {\n                borderColor: 'transparent',\n                color: \"rgb(4,252,254)\",\n                 normal: {\n              // 柱形图圆角，初始化效果\n              // barBorderRadius: [10, 10, 10, 10],\n              color: \"rgb(4,252,254)\",\n            }\n              },\n            // areaStyle: {\n            //   normal: {\n            //     color: new this.$echarts.graphic.LinearGradient(0, 1, 0, 0, [\n            //       {\n            //         offset: 0,\n            //         color: \"rgb(9,84,88)\",\n            //       },\n            //       {\n            //         offset: 1,\n            //         color: \"rgb(9,71,72)\",\n            //       },\n            //     ]),\n            //   },\n            // },\n            // data: [1200, 900, 2000, 666, 999,1200, 3666, 2666,  2666, 1666, 234, 250, 899, 1666, 234, 250, 899, 1200, 900, 2000, 666, 999,3666,900, 2000, 666, 999],\n            data:this.ydata,\n            // markPoint: {\n            //   data: [{ type: \"max\", name: \"最大值\" }],\n            // },\n            // symbol: function (value, params) {\n            //   if (value == min || value == max) {\n            //     return \"circle\"; //拐点类型\n            //   } else {\n            //     return \"none\"; //拐点不显示\n            //   }\n            // },\n            // markPoint: {\n            //   show: false,\n            // },\n            // itemStyle: {\n            //   normal: {\n            //     color: \"#52F478\",\n            //     borderColor: \"#52F478\", //拐点边框颜色\n\n            //     lineStyle: {\n            //       color: \"#52F478\", //折线颜色\n            //     },\n            //     label: { show: false, color: \"#ffffff\" },\n            //   },\n            // },\n      //        emphasis: {\n      //   itemStyle: {\n      //     borderColor: 'transparent',\n      //     color: 'transparent'\n      //   }\n      // },\n        // data: [1000,2000, 1700, 1400, 1200, 300, 199,2000, 1700, 1400, 1200, 300, 199,2000, 1700, 1400, 1200, 300, 199]\n          },\n          //  {\n          // name: 'Life Cost',\n          // type: 'bar',\n          // stack: 'Total',\n          //  barWidth : 4,\n          // label: {\n          //   show: false,\n          //   position: 'inside'\n          // },\n          // itemStyle: {\n          //       borderColor: 'transparent',\n          //       color: \"rgb(4,252,254)\",\n          //        normal: {\n          //     // 柱形图圆角，初始化效果\n          //     barBorderRadius: [15, 15, 15, 15],\n          //     color: \"rgb(4,252,254)\",\n          //   }\n          //     },\n          //   data: [2900, 1200, 300, 200, 900, 300,2900, 1200, 300, 200, 900, 300,2900, 1200, 300, 200, 900, 300]\n          // }\n        ],\n      };\n\n      myChart.setOption(option);\n    },\n  }\n}\n</script>\n\n<style scoped>\n#batchEcharts{\n   width: 90%;\n          height: 95%;\n}\n</style>\n"]}]}