项目中常用的几个ehcharts小效果

写几个不常用但是最近Uo项目用到了的echart效果

主要因为越用越觉得echarts非常的人性化

（1）echart 自由间隔显示轴数据

下面是整十分显示，但是数据本身按照固定interval是无法做到的。

这个方法实在太有用了！

使用属性： axis, axisLabel, interval

我的项目要求比较简单，以前一直用下列方式分割label的显示

interval = number

这次满足不了，后来用函数的方式如下，也能顺利完成。

不得不说echart的定制选项很人性化了，整十分，整小时都可以完美显示；特别是在你的数据无法对称的时候，可以很好地帮助友好显示；
代码如下：

interval: (index: number, value: string) => {
    if (parseInt(this.datePipe.transform(value, 'mm'), 10) % 10 === 0) {
      return true;
    }
},

（2）tooltip默认样式

tooltip不写format属性的时候就是下面这个样子。





然鹅，写了属性，总是无法显示多组数据的情况，反正我没有用abc给拼出来。




所以使用了formatter:(params, ticket, callback) => {};的方式

params是个数组，有几个legend为true的状态，params就有几个长度的信息。官方还非常nice的封了一个marker在里面，以免tooltip太单调又不需要我们单独写标签。

formatter: (params: Array<any>) => {
   const time = params[0].axisValueLabel;
   let formatterString: string = time;
   params.map((v: any) => {
     formatterString += '<br/>' + v.marker + v.seriesName.toLowerCase() + ': ' + v.value;
   });
   return formatterString;
 },