echarts中提示框的样式调整

• 第一种方法：利用tooltip 里面的配置项 默认就会有写显示

• 第二种方法：利用formattet回调函数 返回我们想要显示的信息

• formatter : function (params) {
      var value = (params.value + '').split('.');
      value = value[0].replace(/(\d{1,3})(?=(?:\d{3})+(?!\d))/g, '$1,')
      + '.' + value[1];
      return params.seriesName + '<br/>' + params.name + ' : ' + value;
  }
  
  参数有：params, ticket, callback
  可以打印看一下，其中有没有自己需要的信息，如果没有就需要单独设置
  
  

• 第三种方法：有时候可能echarts中提示的信息有很多，样式可能靠左边对齐，也可能居中对齐，前两种的方法就解决不了，需要第三种,可以把需要的值包裹在一个标签里面，然后给这个标签设置样式，整体的return出来，也可以添加一个类，单独的设置样式；eg： 让提示信息居中

• formatter:function(params){
        return (  '<div style = "text-align:center">' +  '功率 ' + ':' + one + '<br/>' + '转速' + ':' + two + '<br/>' + '时间' + ':' + params.value[2] + '(h)')  + '</div>';
  }

   

   

• 第四种方法：简单粗暴，在实例化这个echarts容器上，增加样式

•  <echart-line style="height: 500px; text-align:left" id="powerTimeReport" options="powerTimeReportOptions" ></echart-line>

   

• 因为提示框本质上也是一个div，会继承父类的样式，利用这个特性也可以修改提示框的样式