Echarts 折线图一个点显示多个实时数据tooltip

在项目开发需要中。有个需求就是在折线图的每一个折点上悬浮窗要显示几条不同的数据而且是跟x轴一样每个点不一样。。研究了一下。。有点坑。其实很简单,正常的思路来想 要想在悬浮窗显示数据 一般都会有线 才会有实时数据。。这里提一下series:data这个数据入口问题,

    问题解决就在data里面,那怎么弄呢,首先你要明白 data里面是可以json数组形式的比如官方API上的 name:”“, value:”“,等 value是echart识别折线图的KEY但是可能很多人不知道data里面可以自定义Key并且取出来,来看数据:

                 {value:"0.0",真空抛料数:"301",影像抛料数:"30"},

                {value:"0.79",真空抛料数:"30",影像抛料数:"30",报警:["2018-05-19 02:00", "SystemLINE S16D4-1", "SystemLINE S16", 1, 3, 2, 5, 0]},

                {value:"0.08",真空抛料数:"30",影像抛料数:"30"},

这里面value是线上的数据 其他的是我想在tooltip悬浮窗显示的实时数据,tooltip 设置:

这里有个小问题 如果下边样式什么的不加可以直接显示但是 加上一点样式之后不知道为什么需要微调一线才会显示。。具体可以看一下params里面的具体数据格式。到这里问题基本解决了。


©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 174,644评论 25 709
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,269评论 19 139
  • 欢迎来到炼狱岛,今天的题目是:让钱变成资本的三要素。 昨天我们讲到了笑来老师说的遇到贵人的12条原则。 我们需要明...
    不认识Arrow阅读 844评论 0 1
  • 这小区的名字叫做死无葬身之地小区,听着名字感觉挺吓人,其实听这名字确实挺吓人的。小区的名字当然不叫这个,这个是居住...
    小眼睛大鼻子阅读 177评论 0 1
  • 近两年发现时间过得尤其快。毕业两年,工作两年,除了得到了自以为的成熟,其他一无所获。 记得快要毕业的那会,就忙活做...
    何稳静阅读 313评论 0 0