完成两个柱状图
This commit is contained in:
		@@ -16,7 +16,7 @@ export default {
 | 
			
		||||
    series: Object,
 | 
			
		||||
    theme: {
 | 
			
		||||
      default: '0'
 | 
			
		||||
    }
 | 
			
		||||
    },
 | 
			
		||||
  },
 | 
			
		||||
  components: {
 | 
			
		||||
    renderComponent: {
 | 
			
		||||
@@ -32,7 +32,6 @@ export default {
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
 | 
			
		||||
  data() {
 | 
			
		||||
    return {
 | 
			
		||||
      chart: null,
 | 
			
		||||
@@ -44,10 +43,8 @@ export default {
 | 
			
		||||
      if (this.theme === '0') {
 | 
			
		||||
        return ['#2896FF', '#09DBFE', '#61FDB9', '#FFBB69', '#8429FF', '#ea7ccc']
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
      return ['#D4380D', '#CF1322', '#D55800', '#FA8C16', '#FFC53D', '#FFA940', '#FFC53D', '#780000']
 | 
			
		||||
      return this.color || ['#D4380D', '#CF1322', '#D55800', '#FA8C16', '#FFC53D', '#FFA940', '#FFC53D', '#780000']
 | 
			
		||||
    },
 | 
			
		||||
 | 
			
		||||
    chartOptions() {
 | 
			
		||||
      let {type, data, ops: options = {}} = this,
 | 
			
		||||
          style = this.series ? this.series : this.ops.daemon ? this.ops.daemon : {},
 | 
			
		||||
@@ -81,8 +78,6 @@ export default {
 | 
			
		||||
          },
 | 
			
		||||
          axisLabel: {color: '#fff'}
 | 
			
		||||
        },
 | 
			
		||||
        legend, series, ...options,
 | 
			
		||||
        color: colors,
 | 
			
		||||
        grid: {
 | 
			
		||||
          left: '0%',
 | 
			
		||||
          right: '0%',
 | 
			
		||||
@@ -90,6 +85,8 @@ export default {
 | 
			
		||||
          top: '40px',
 | 
			
		||||
          containLabel: true
 | 
			
		||||
        },
 | 
			
		||||
        legend, series, ...options,
 | 
			
		||||
        color: colors,
 | 
			
		||||
      }
 | 
			
		||||
      if (JSON.stringify(this.ops) != JSON.stringify(ops)) this.$emit("update:ops", ops)
 | 
			
		||||
      return ops
 | 
			
		||||
@@ -130,20 +127,22 @@ export default {
 | 
			
		||||
          }
 | 
			
		||||
        }, true)
 | 
			
		||||
      }
 | 
			
		||||
      this.resize()
 | 
			
		||||
    },
 | 
			
		||||
    initChart() {
 | 
			
		||||
      this.chart = echarts.init(this.$refs.AiEchart)
 | 
			
		||||
      this.chart.setOption(this.chartOptions || {})
 | 
			
		||||
    },
 | 
			
		||||
    watchResize() {
 | 
			
		||||
      window.onresize = () => {
 | 
			
		||||
        const {clientHeight, clientWidth} = this.$refs.AiEchart || {},
 | 
			
		||||
            h = this.chart?.getHeight(), w = this.chart?.getWidth()
 | 
			
		||||
        if (h != clientHeight || w != clientWidth) {
 | 
			
		||||
          this.chart?.resize()
 | 
			
		||||
        }
 | 
			
		||||
    resize() {
 | 
			
		||||
      const {clientHeight, clientWidth} = this.$refs.AiEchart || {},
 | 
			
		||||
          h = this.chart?.getHeight(), w = this.chart?.getWidth()
 | 
			
		||||
      if (h != clientHeight || w != clientWidth) {
 | 
			
		||||
        this.chart?.resize()
 | 
			
		||||
      }
 | 
			
		||||
    },
 | 
			
		||||
    watchResize() {
 | 
			
		||||
      window.onresize = this.resize
 | 
			
		||||
    },
 | 
			
		||||
    refresh() {
 | 
			
		||||
      this.chart.setOption(this.chartOptions || {})
 | 
			
		||||
    }
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user