admin管理员组

文章数量:1611167

问题：统一设置position肯定都会，但是这样的写法不可避免的会遇到这样的问题：

这里只讨论值大于0的情况

series: [
    {
      data: [120, 200, 150, 0, 10, 110, 130],
      type: 'bar',
      label: {
        show: true,
        fontSize: 20,
        color: '#db0000',
        position: 'insideTop'
      }
    }
  ]

解决思路：

找到这组数据中的最大值，然后自己根据实际情况定义一个系数（计算得到一个最小柱高正好可以完整显示数值） showLabel = 最小柱高 = 最大值 / 系数 只要当前的值小于这个最小柱高就展示在柱子靠底边insideBottom，否则展示在柱子靠定边insideTop
获取最大值的方法：排序数组.sort()之后取最后一位，写个for循环一个一个比（实际也是sort()）,Math.max()

提示：有时候这个值正好可以显示，但是insideBottom 和 insideTop 都是距底部或顶部有间距，用inside更好，设置也是同理，需要自己找到一个更合适的系数就ok了。position如果写成函数之后，数值不会在bar中横向居中（很难受，使用rich改样式也没法居中）！！！非常推荐用：三元运算符！！！
解决：
this.value = [120, 200, 150, 0, 10, 110, 130]
const showLabel = 200 / 10
series.data: this.value.map(item => {
   return {
     value: item,
     label: {
       show: true,
       position: item < showLabel ? 'insideBottom' : 'insideTop'
     }
   }
 })

本文标签： seriesechartsPositionLabel

版权声明：本文标题：echarts中series给label单独设置position 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：https://www.elefans.com/xitong/1728603651a1165174.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。