ÎļþÃû´Ó src/views/line_graph/components/LineChart.vue ÐÞ¸Ä |
| | |
| | | seriesName: { |
| | | type: String, |
| | | default: 'ç³»åä¸' |
| | | }, |
| | | areaColor: { |
| | | type: Array, |
| | | default: () => { |
| | | return [] |
| | | } |
| | | } |
| | | }, |
| | | data() { |
| | |
| | | }, |
| | | mounted() { |
| | | this.intiChart() |
| | | |
| | | window.addEventListener('resize', this.resizeChart) |
| | | }, |
| | | watch: { |
| | |
| | | toolbox: { |
| | | // å·¥å
·æ |
| | | feature: { |
| | | // dataZoom: { |
| | | // // åºåç¼©æ¾ |
| | | // yAxisIndex: 'none' |
| | | // }, |
| | | |
| | | // ä¿å为å¾ç |
| | | saveAsImage: {} |
| | | } |
| | |
| | | { |
| | | name: this.seriesName, |
| | | type: 'line', |
| | | data: this.chartData.y |
| | | data: this.chartData.y, |
| | | // 忢æå®æ¶é´åºé´çèæ¯é¢è² |
| | | |
| | | markArea: { |
| | | itemStyle: { |
| | | color: '#e5e6eb' |
| | | }, |
| | | |
| | | data: this.areaColor |
| | | } |
| | | } |
| | | ] |
| | | } |
| | |
| | | height: 300px; |
| | | margin-top: 25px; |
| | | margin-left: 30px; |
| | | color: #535a64; |
| | | } |
| | | </style> |