echarts中改變一些屬性

//改變提示框的位置
 tooltip: {
  trigger: 'axis',
  //改變提示框的位置
  position: function(point, params, dom, rect, size){
    //其中point爲當前鼠標的位置，size中有兩個屬性：viewSize和contentSize，分別爲外層div和tooltip提示框的大小
    var x = point[0];
    var y = point[1];
    var viewWidth = size.viewSize[0];
    var viewHeight = size.viewSize[1];
    var boxWidth = size.contentSize[0];
    var boxHeight = size.contentSize[1];
    var posX = 0;//x座標位置
    var posY = 0;//y座標位置
    if(x<boxWidth){//左邊放不開
      posX = 5;
    }else{//左邊放的下
      posX = x-boxWidth;
    }
    if(y<boxHeight){//上邊放不開
      posY = 5;
    }else{//上邊放得下
      posY = y-boxHeight;
    }
    return [posX,posY];

  }
},
//改變座標軸的顏色
//X軸
xAxis: {
  name: "時",
  boundaryGap: false,
  axisLine: {
    lineStyle: {
      color: "#8b8989" // x座標軸的軸線顏色
    }
  },
  axisLabel: {
    show: true, //這行代碼控制着座標軸x軸的文字是否顯示
    textStyle: {
      color: "#707070", //x軸上的字體顏色
      fontSize: "12" // x軸字體大小
    }
  },
  type: "category",
  data:this.dataX
},
 //Y軸
yAxis: {
  name: "℃",
  type: "value",
  nameTextStyle: {
    fontSize: 16
  },
  splitLine: {
    //  改變軸線顏色
    lineStyle: {
      // 使用深淺的間隔色
      color: "#edeeed"
    }
  },
  axisLine: {
    lineStyle: {
      color: "#8b8989" // x座標軸的軸線顏色
    }
  },
  axisTick: { show: false },
  axisLabel: {
    textStyle: {
      align: "left",
      color: "#707070", //x軸上的字體顏色
      fontSize: "12" // x軸字體大小
    },
    formatter: "{value}",
    interval: 0,
    margin: 40
  }
},
//修改X軸的文字傾斜顯示
axisLabel: {
    show: true, //這行代碼控制着座標軸x軸的文字是否顯示
    textStyle: {
      color: "#707070", //x軸上的字體顏色
      fontSize: "12" // x軸字體大小
    },
    rotate:60,//修改X軸的文字傾斜顯示
  }
    
//自定義提示框
tooltip: {
  trigger: 'axis',
  axisPointer: {
    animation: false
  },
  formatter: function (params) {
    var htmlStr = '';
    htmlStr += '<div><span style="color:#fff;">' + params[0].name + '</span><br/> ';
    for(var i=0;i<params.length;i++){
      htmlStr += '<span style="width: 8px;height: 8px;display:inline-block;border-radius: 50%;background-color:'+params[i].color+'"></span><span style="color:#fff;">' + params[i].seriesName + ':</span>'+
        '<span style="color:#fff;">' + params[i].value + '&nbsp;PPM</span><br/>';//能夠加單位
    }
    htmlStr += '</div>';
    return  htmlStr
  },
},
//餅圖修改成有層次的餅圖：

 series : [
    {
      name: '機器狀態',
      type: 'pie',
      radius : '80%',
      center: ['50%', '60%'],//修改餅圖所在的位置
      data:this.StateY,
      roseType: 'radius',//修改餅圖的層次
      itemStyle: {
        emphasis: {
          shadowBlur: 10,
          shadowOffsetX: 0,
          shadowColor: 'rgba(0, 0, 0, 0.5)'
        }
      },
      animationType: 'scale',
      animationEasing: 'elasticOut',
      animationDelay: function (idx) {
        return Math.random() * 200;
      }
    }
  ]
 //修改圖標的標線（將一個值做爲基準）
 series: [
      {
        name: "數據",
        type: "line",
        smooth: true,
        sampling: "average",
        itemStyle: {//數據線的顏色
          color: "#5da4da"
        },
        data: data,
        markLine: {//修改圖標的標線
            silent: true,
            lineStyle:{
                color: "red",//設置標線的顏色
            },    
            data: [{//設置標線的值（能夠設多個值，根據項目需求）
                yAxis: 50,
            }]
        }
      }
    ]複製代碼