echart參數設置——曲線圖

  {
    title: {
      text: '請求返回碼分佈',
      subtext: '實時數據'
    },
    tooltip: {
      trigger: 'axis',
    position: function (point, params, dom, rect, size) {//固定在頂部
      return [point[0], '10%'];
    },
      formatter: "發生時間:{b}<br/>返回碼:{a}<br/>數量(個):{c}",//<br/>錯誤描述:{d}
      // formatter: function (params, ticket, callback) {
      //   // console.log(params,666)
      //   let htmlStr = '';
      //   for (let i = 0; i < params.length; i++) {
      //     let param = params[i];
      //     let xName = param.name;//x軸的名稱
      //     let seriesName = param.seriesName;//圖例名稱
      //     let value = param.value;//y軸值
      //     let color = param.color;//圖例顏色
      //     if (i === 0) {
      //       const errorCode = params[0].name.split("/");
      //       const errorCodeName = errorCode[1];
      //       const errorCodeTime = errorCode[0];
      //       htmlStr += '錯誤編碼:'+errorCodeName + '<br/>';
      //       htmlStr += '發生時間:'+errorCodeTime + '<br/>';
      //     }
      //     htmlStr += '<div>';
      //     //爲了保證和原來的效果同樣,這裏本身實現了一個點的效果
      //     htmlStr += '<span style="margin-right:5px;display:inline-block;width:10px;height:10px;border-radius:5px;background-color:' + color + ';"></span>';
      //     //圓點後面顯示的文本
      //     htmlStr += '數量(個):'+ value ;
      //     htmlStr += '</div>';
      //   }
      //   return htmlStr;
      // }
    },
    legend: {
      data: [],//"請求錯誤碼"
    },
    toolbox: {
      itemSize: 20,
      right: "2%",
      feature: {
      mark: {show: false},
      dataView: {show: false, readOnly: false,},
      magicType: {show: false, type: ['line', 'bar']},
      restore: {show: false},
      saveAsImage: {show: true, pixelRatio: 2},
      dataZoom : {
        yAxisIndex : "none" //不啓用y軸的選中
      }
      }
    },
    calculable: true,
    xAxis: [
      {
        type: 'category',
        data: []
      },
    ],
    yAxis: [
      {
        type: 'value',
        axisLabel: {
          formatter: '{value}'
        }
      },
    ],
    series: [
      // {
      //   name: "",//請求錯誤碼
      //   type: 'line',
      //   data: [],
    ]
  };
相關文章
相關標籤/搜索