echarts tooltip提示框 自定义小圆点(颜色、形状…

2019-01-04 09:48:25来源:博客园 阅读 ()

新老客户大回馈,云服务器低至5折

项目是拿 echarts + 百度地图 来做可视化界面,现在到收尾阶段慢慢优化。

先附代码:

formatter: function(params) {
  var result = ''
  params.forEach(function (item) {
    console.log(item)
    result += item.axisValue + "</br>" + item.marker + item.data
  })
  return result
}

如下图,默认圆点颜色为红色:

 

其中item打印出如下图:

发现marker(小圆点)即为html片段,要改变小圆点颜色只需自定义html即可。

附代码:

formatter: function(params) {
  var result = ''
  var dotHtml = '<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#1197b8"></span>'
  params.forEach(function (item) {
    result += item.axisValue + "</br>" + dotHtml + item.data
  })
  return result
}

效果图:

 同理,要改变小圆点形状,重写html片段即可。

 

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:ajax跨域请求(注:只是单纯的跨域请求,没有做安全认证,亲测有

下一篇:《JavaScript高级程序设计》笔记:事件(十三)