Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/391.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 将数组值转换为百分比_Javascript_Php_Html_Arrays - Fatal编程技术网

Javascript 将数组值转换为百分比

Javascript 将数组值转换为百分比,javascript,php,html,arrays,Javascript,Php,Html,Arrays,我有一个饼图,它引用了数组中的值 我想以百分比的形式显示这些数组值。我该怎么做 我用来生成这个饼图的插件是chart.js Javascript供参考: success : function (data){ console.log(data); var categoryname = ["Drain", "Building", "Pest", "Broken Utilities", "Littering", "Leakage", "Lighting"]; var

我有一个饼图,它引用了数组中的值

我想以百分比的形式显示这些数组值。我该怎么做

我用来生成这个饼图的插件是
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);
}
$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);
Php供参考:

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);
}
$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);
Piechart图像示例:

试试这个

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
}

其思想是首先存储
数据
对象中的整数值。然后求和总值。最后,我们推送实际百分比值并将
%
添加到饼图的
金额
数据中。

数据:金额
中,
金额
值格式是什么?小数?整数?您可能需要创建函数帮助程序来创建percentages@rachmatsasongko它们是整数