ECharts 图表标记最大值、最小值和平均值样式设置

在官网示例中图表标记最大值和最小值的样式是带有图形的,如下:我所需要的图表标记最大最小值样式简单的不需要图形:官网的示例默认这样的:

markPoint: {
  data: [
   { type: 'max', name: 'Max' },
   { type: 'min', name: 'Min' }
  ]
},

symbolSize:标记的大小,可以设置成诸如 10 这样单一的数字,也可以用数组分开表示宽和高,例如 [20, 10] 表示标记宽为20,高为10。symbolSize是设置图表标记的大小,我们把它设置成symbolSize:1,让他宽高变小,整体上看是感觉没有的,但是实际还是存在的只是太小看不见了。

label:标注的文本。用来设置标签的内容的样式和文本。

formatter:

标签内容格式器,支持字符串模板和回调函数两种形式,字符串模板与回调函数返回的字符串均支持用 \n 换行。

字符串模板 模板变量有:

  • {a}:系列名。
  • {b}:数据名。
  • {c}:数据值。
  • {@xxx}:数据中名为 'xxx' 的维度的值,如 {@product} 表示名为 'product' 的维度的值。
  • {@[n]}:数据中维度 n 的值,如 {@[3]} 表示维度 3 的值,从 0 开始计数。

示例:

formatter: '{b}: {@score}'

完整代码: 

markPoint: {
        data: [
            { 
              type: 'max',
              name: 'Max',
            },
            { 
              type: 'min',
              name: 'Min',
            }
        ],
        symbolSize: 1,
        symbolOffset: [0, -6],
        label:{
            formatter:'{b}: {@score}',
            color :'black'
        }
},

这些配置项在官网上可以进行在线的调试,根据自己所需要的。查看效果。Documentation - Apache EChartsicon-default.png?t=O83Ahttps://echarts.apache.org/zh/option.html#title

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值