簡體   English   中英

自動將絕對數字轉換為echarts中的百分比值

[英]Automatically convert absolute numbers into to percent values in echarts

我正在嘗試使用百分比值而不是數值的圖表。

這是我的圖表: 在此處輸入圖片說明

是否可以將條形圖中的數字自動轉換為百分比? (在示例中,范圍是0到50,000,我希望將其從0%轉換為100%)。

y軸的百分比可以為0,10,20...。100%必須有num總數,在這種情況下total = 50000;

現在獲取數據並計算%=數據/總計* 100並將其繪制在圖形上。 希望對您有所幫助。

百分比為(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> 

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM