echarts 格式修改

img


就是有三个问题
第一个是怎么把横向的线改成透明色
第二个是x轴坐标内容，它显示的不全，偶数位的都没显示（我用了interval: 0,也没用）
第三个是

img


怎么把它移到标题旁边，并修改颜色啊


(function () {
  var myChart = echarts.init(document.querySelector(".bar3 .chart"));
  var option = {
      color: ['#FFF0F5', '#FF7F50','#DC143C','#D8BFD8'],

        tooltip: {
          trigger: 'axis',
          axisPointer: {
            type: 'shadow'
          }
        },
        legend: {},
        grid: {
              left: '0%',
              top: '10px',
              right: '0%',
              bottom: '4%',
              containLabel: true
            },
        xAxis: [{
            type: 'category',
            interval: 0,
            data: [ ' 冈察洛娃 ' , ' 布耶里卡 ' , ' B-马丁内兹 ' , ' 朱婷 ' , ' 斯洛特耶斯 ' , ' 石井优希 ' , ' 洛伦内 '  ],
          axisTick: {
                  alignWithLabel: true
                },
                axisLabel: {
                        color: "rgba(255,255,255,0.8)",
                        fontSize: 10
                      },
                      axisLine: {
                              show: false
                            }

          }
        ],
        yAxis: [
          {
            type: 'value',

            axisLabel: {
                    color: "rgba(255,255,255,0.6)",
                    interval: 0,
                    fontSize: 12
                  },
                   axisLine: {
                          lineStyle: {
                            color: "rgba(255,255,255,0.6)",
                            width: 2
                          }
                        },

          }
        ],
        series: [

          {
            name: '扣',
            type: 'bar',
            stack: '总分',
            emphasis: {
              focus: 'series'
            },
            data: [ ' 184 ' , ' 187 ' , ' 181 ' , ' 153 ' , ' 156 ' , ' 158 ' , ' 139 ' ]
          },
          {
            name: '拦',
            type: 'bar',
            stack: '总分',
            emphasis: {
              focus: 'series'
            },
            data: [ ' 20 ' , ' 13 ' , ' 13 ' , ' 16 ' , ' 13 ' , ' 3 ' , ' 16 ' ]
          },
          {
            name: '发',
            type: 'bar',
            stack: '总分',
            emphasis: {
              focus: 'series'
            },
            data: [ ' 5 ' , ' 9 ' , ' 3 ' , ' 9 ' , ' 2 ' , ' 9 ' , ' 6 ' ]
          },
          {
            name: '扣球成功率',
            type: 'bar',
            emphasis: {
              focus: 'series'
            },

            data: [44.88, 48.26, 45.36, 54.64, 46.67, 45.38, 45.36]
          },

          // {
          //   name: '总分',
          //   type: 'bar',
          //   data: [209, 209, 197, 178, 171, 170, 161],
          //   emphasis: {
          //     focus: 'series'
          //   },
          //   markLine: {
          //     lineStyle: {
          //       type: 'dashed'
          //     },
          //     data: [[{ type: 'min' }, { type: 'max' }]]
          //   }
          // },




        ]
      };

  myChart.setOption(option);
  window.addEventListener('resize', function () {
    myChart.resize();
  })
})();
  1. xAxis.axisTick.lineStyle 设置x轴刻度线样式
  2. xAxis.axisLabel.interval = 0
  3. legend设置left right top bottom 属性去移动