配列値をパーセンテージに変換するJavaScript

Question

配列の値を参照する円グラフがあります。

これらの配列値をパーセンテージで表示したいとします。これはどうすればいいですか？

私はこの円グラフを生成するために使用されるプラグインは、参考のためにchart.js

のJavascriptです：参照用

success : function (data){ 
    console.log(data); 

    var categoryname = ["Drain", "Building", "Pest", "Broken Utilities", 
    "Littering", "Leakage", "Lighting"]; 
    var category = []; 
    var amount = []; 

    for (var i in data) { 
     category.push(categoryname[data[i].Category]); 
     amount.push (data[i].CaseNum); 
    } 
    var config = { 
     type: 'pie', 
     data: { 
      datasets: [{ 
       data: amount, 
       backgroundColor: [ 
        "rgba(59, 89, 152, 1)", 
        "rgba(59, 89, 152, 1)", 
        "rgba(59, 89, 152, 1)", 
        "rgba(59, 89, 152, 1)", 
        "rgba(59, 89, 152, 1)", 
        "rgba(59, 89, 152, 1)", 
        "rgba(59, 89, 152, 1)" 
        ], 
       label: 'Dataset 1' 
      }], 
       labels: category 
     }, 
     options: { 
      responsive: true 
     } 
    }; 
    var ctx = $("#mycanvas");  
    var graph = new Chart(ctx, config); 
} 

PHPの：

$query = "SELECT categoryID as 'Category', COUNT(Case.categoryID) as 'CaseNum' 
FROM `Case` WHERE CaseTime BETWEEN DATE_SUB(now(), INTERVAL 6 MONTH) AND 
now() GROUP BY categoryID ORDER BY categoryID"; 

$result = $conn->query($query); 

$data = array(); 
foreach ($result as $row) { 
    $data[] = $row; 
} 


$conn->close(); 

print json_encode($data); 

円グラフ画像例：

Answer 1

これを試してください

success : function (data){ 
    console.log(data); 

    var integerAmount = []; 
    for (var i in data) { 
     integerAmount.push(data[i].CaseNum); 
    } 
    var sum = integerAmount.reduce((a, b) => a + b, 0); 
    var categoryname = ["Drain", "Building", "Pest", "Broken Utilities", "Littering", "Leakage", "Lighting"]; 
    var category = []; 
    var amount = []; 
    for (var i in data) { 
     category.push(categoryname[data[i].Category]); 
     amount.push (integerAmount[i]/sum*100+'%'); 
    } 

    // rest of the script 
} 

最初にdataオブジェクトから整数値を格納することをお勧めします。合計値を合計します。最後に、実際のパーセント値を押し、円グラフのデータのamountに%を追加します。