echarts使用小技巧

echarts开发的小功能，记录一下

1.修改legend的颜色，在legend的同级下面添加颜色数组

legend: {
    left: 'right'
},
color: ['#4DECA7', '#4CC5EB', '#AFEB4C'],

2.将legend修改为圆形，icon: "circle", 这个字段控制形状  类型包括 circle 圆形，triangle 三角形，diamond 四边形，arrow 变异三角形，none 无

legend: {
    orient: 'vertical',
    x: 'left',
    y: 'bottom',
    icon: "circle",
},

3.去掉y轴

yAxis: {
    type: 'category',
    data: ['Brazil', 'Indonesia'],
    axisLine: {
        show: false
    },
    axisTick: {
        show: false
    },
    //去掉y轴
    show: false
},

4.窗口自适应

  mounted () {
    this.initChart()
    // this.getData()
    // this.getTotalData()
    window.addEventListener('resize', this.handleWindowResize)
  },
  destroyed () {
    // 在组件销毁的时候, 需要将监听器取消掉
    window.removeEventListener('resize', this.handleWindowResize)
  },
  methods: {
      handleWindowResize () {
          if (!this.histogram) return
          this.histogram.resize()
    },
  }

5.网格线显示虚线

yAxis: [
    {
        type: 'value',
        splitLine: {
            lineStyle: {
            type: 'dashed' //虚线
        },
            show: true //隐藏
        }
    }
],

6.气泡图中间显示文字

label: {//气泡图中心显示文字
    show: true,
    value: 'param.data[3]',
    formatter: function (param) {
    return param.data[3];
},
   color: 'black'
},

7.实际的效果图