Automatically convert absolute numbers into to percent values in echarts

Question

I am trying to have a chart with percent values instead of the numeric values I'm feeding to it.

This is my chart:

Is there an option to automatically convert the numbers in the bar chart to percentages? (In the example, there is a range from 0 to 50,000, and I want that to be converted from 0% to 100%).

Answer 1

You can have y axis in percentage 0,10,20 .... 100% You must have total num , in this case total = 50000;

Now get the data and calculate % as = data/total * 100 and plot it on graph. I hope it helps.

Answer 2

Percentage is (100/maxValue) * value .

 var max = document.getElementById("max"); var offset = document.getElementById("offset"); var output = document.getElementById("output"); var c = document.getElementById("c").getContext("2d"); function getPercentage() { var all = parseInt(max.value); var off = parseInt(offset.value); output.innerHTML = ((100 / all) * off) + "%"; c.fillStyle="#eee"; c.fillRect(0, 0, c.canvas.width, c.canvas.height); c.fillStyle="red"; c.fillRect(25, c.canvas.height, 50, 0 - ((1 / all) * off) * c.canvas.height) } max.onchange = getPercentage; max.onkeyup = getPercentage; offset.onchange = getPercentage; offset.onkeyup = getPercentage; getPercentage() 

 <label>Max: <input type="number" value="100" id="max"/></label><br> <label>Offset: <input type="number" value="90" id="offset"/></label> <p id="output"></p> <canvas id="c" width="100" height="100"></canvas>