How does echarts formatter customize the decimal position of the percentage, such as taking an integer. {b}{d}%
1. Status
I have a graph of pie optionthat formatterlooks like this:
label: {
show: true,
position: 'outside',
fontSize: 12,
formatter: '{b} {d}%'
},
The graph data is like this
2. Demand
I need to change the content of the percentage to an integer instead of two decimal places
Three, realize
Just modify the formatter, but this time, instead of using the variables that come with echarts, you define it yourself.
1. Confirm what are the operable variables
First look at what's in the data:
formatter: data => {
console.log(data)}
After knowing the variables we need, name percentwe can customize the output string. My definition is as follows:
label: {
show: true,
position: 'outside',
fontSize: 12,
formatter: data => {
return `${
data.name}\t${
data.percent.toFixed(0)}%`
}
},
Currently this is the status:
2. Eliminate 0% cases
It can be found that a problem that is less than 1% becomes 0%, and this is unreasonable, at least it should be expressed as 1%
So change it again to round up. useMath.ceil()
label: {
show: true,
position: 'outside',
fontSize: 12,
formatter: data => {
return `${
data.name}\t${
Math.ceil(data.percent)}%`
}
},
4. Results
finally:
