echarts的气泡图--散点图的标题常态显示

4 篇文章 0 订阅

最近在调一个图形的的时候,碰到的这个问题,正常状态下需要悬停在气泡上才会展示,现在需要在气泡图上常态显示每个气泡的标签名称,不太好找,废了一些劲,做个记录

代码如下

        series: [{
          name: '气泡图',
          data: this.scatterdatas,
          type: 'scatter',
          symbolSize: data => {
            return Math.sqrt(data[3]*100);
          },
          itemStyle: {
            normal: {
              shadowBlur: 10,
              shadowColor: 'rgba(120, 36, 50, 0.5)',
              shadowOffsetY: 5,
              //此处起作用,展示你需要的标签
              label:{
                show: true,
                formatter: param => {
                  return param.data[2];
                },
                position: 'top'
              },
              //-----到此为止
              color: params => {
                var colorList = [
                  '#fb6340','#1d8cf8','#ff715e','#ffaf51','#ffee51','#8c6ac4','#715c87'
                ];
                return colorList[params.dataIndex % 7];
              }
            }
          }
        }]

代码是在Vue的页面下的,起作用的地方主要在label那里,尝试过放itemStyle外边,不行,只能放里边。注意放在series里面

图形效果
在这里插入图片描述

  • 6
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值