Incubator-echarts: 如何控制tooltip 的内容？

[ruofeng086]

One-line summary [问题简述]

希望实现类似这样的样式，但在官网文档中找不到相应配置项

Version & Environment [版本及环境]

• ECharts version [ECharts 版本]: 3
• Browser version [浏览器类型和版本]: chrome 54
• OS Version [操作系统类型和版本]: mac os

Expected behaviour [期望结果]

告知如何实现这样的样式，如，时间是怎么添加上去的？是那个字段控制的

ECharts option [ECharts配置项]

option = {

}

Other comments [其他信息]

[sevenen]

显示tooltip时，默认的显示是这样的

横轴显示在最上面，这个图里就是周二，纵轴依次显示在下面，就是下面的一排的显示。和你的给的不太一样。
如果你要控制其中的内容，比如让周二不显示，就用tooltip--formatter来控制。但是想要这种彩色的效果就难了。api为http://echarts.baidu.com/option.html#tooltip.formatter

[ruofeng086]

例子中使用的也是echart，那他是怎么实现的？

[ruofeng086]

目前已实现90%，剩余这个提示框没有找到相应文档。

[sevenen]

不知道啊，能不能看一下他的源码啊。。。你试试graphic？不过这个东西好麻烦http://echarts.baidu.com/option.html#graphic

[iamwelk]

使用formatter控制显示，自定义里面的样式就可以了吧

[sevenen]

时间下面的那条横杠是怎么显示的呢？

[iamwelk]

http://echarts.baidu.com/demo.html#line-sections

tooltip: {
    trigger: 'axis',
    formatter: function (obj) {
        return '<div style="border-bottom:1px solid #eee">' + obj[0].name + '</div>';
    }
}