前端"拦路虎"记录

是对项目中遇到的一些"拦路虎"记录一下...好记性不如烂笔头 小声:组会/日报的时候也好有东西写. PS:先写在本地, 想起来或者996有空再慢慢更

目的:Echart柱状图中柱体上面的label中数值显示两位小数

from: 03/02/2022 metro项目

1. 看了老代码和LabelAPI发现formatter应该是关键
2. formatterAPI中没有直接能够达到目的的设置参数, 应该得通过这个参数自己写个方法返回符合目的的字符串,但是没怎么看懂官网formatter内部的参数...于是google
3. eCharts——柱状图中柱体上面显示数字和关于formatter的用法看了一下发现写法就是直接给formatter这个参数一个函数.

4. //不清楚里面有啥可用的...想了想直接根据当前有数据的记录打印了一下里面有的参数
   formatter: (...arg) => {
     console.log(...arg)
   }
   //观察了下, value和data都是当前数据, 我选了对value进行格式上的操作
   

5. //最终代码, 
   formatter: ({ value }) => `${value.toFixed(2)}`
   ​
   /*https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Number/toFixed
   toFixed() 方法使用定点表示法来格式化一个数值。
   语法 
   numObj.toFixed(digits)
   参数
   digits
   小数点后数字的个数；介于 0 到 20 （包括）之间，实现环境可能支持更大范围。如果忽略该参数，则默认为 0。
   返回值
   使用定点表示法表示给定数字的字符串。
   */