0

円グラフが必要で、Flotを見つけました。シンプルで強力に見えますが、私が見つけたすべての例は、固定値 ([1,2] など) を使用して「データ」を記述していますが、動的データを表示する必要があります。最終的に合計が 100 になる変数が 5 つあります。値が 0 を超える変数のみを含め、合計が 100 にならない場合は、不足しているパーセントを示す要素を追加したいと考えています。問題は、データ パラメータを動的に構築する方法がわからないことです。

私のコードは以下です。これには 2 つの問題があります: 1) $.plot は何もしません - エラーもグレーピーもありません 2) ラベル テキストを追加する方法がわかりません

function updatePieChart() {
    var total = 0;
    var data = new Array();
    var verb = "";
    var dataIndex = 0;

    for (var dataIndex = 0; dataIndex < 5; dataIndex++) {
        var duty = "DUTY_" + (dataIndex + 1);
        var d = getData(duty + "_PERCENTAGETIMESPENT");
        if (isNumeric(d)) {
            d = parseInt(d);
            if (d > 0) {
                total += d;
                data[dataIndex] = new Array();
                data[dataIndex].push(d);
                verb = getData(duty + "_SKILL");
                if (verb == "") verb = duty + dataIndex;
                log(duty + dataIndex + ' value: ' + d);
            }
        }
    }

    var count = data.length;
    if (total != 100) {
        if (total < 100) {
            var missingDataNum = 100 - total;
            data[count] = new Array();
            data[count].push(missingDataNum);
            verb = '**MISSING**';
            log(verb + missingDataNum);
        }
    }

    $.plot($('#pieChart'), data,
        {
        series: {
            pie: {
                show: true,
            }
        },
        legend: {
            show: false
        }
    });
}
4

2 に答える 2

1
var ary = new Array();


ary.push(1); // this is where you would push the numbers that are supposed to add to 100
ary.push(2); 
ary.push(23); 
ary.push(40); 
ary.push(10); 
ary.push(8); 

var result = 0;
for (var i = 0; i< ary.length; i++) {
result += ary[i];
}

これresultで合計が含まれるはずです。次:

if (result < 100){
    var missing = 100 - result;
    ary.push(missing); 
}

missing次に、配列の最後にプッシュしました。したがって、配列の内容は正確に100まで追加され、「空」(この場合は16)がグラフの最後の要素になります。

それはあなたが探していたものですか?

編集 -私は、JSで+が混乱するのを防ぐために次のことを行います。

if (total != 100) {
    if (total < 100) {
        var missinDataNum = 100 - total;
        series.push('{label: **MISSING**,data: ' + missingDataNum + '}');
    }
}

*2番目の編集*

if (d1 > 0) series.push('{label: "' + d1v + '",data: ' + d1 + '}');
if (d2 > 0) series.push('{label: "' + d2v + '",data: ' + d2 + '}');
if (d3 > 0) series.push('{label: "' + d3v + '",data: ' + d3 + '}');
if (d4 > 0) series.push('{label: "' + d4v + '",data: ' + d4 + '}');
if (d5 > 0) series.push('{label: "' + d5v + '",data: ' + d5 + '}');
于 2012-12-14T18:40:47.557 に答える
1

修理済み。データを変数として渡す場合の jQuery Flot データの形式を参照してください。問題は、データ オブジェクトを JSON オブジェクトとして正しくフォーマットしていなかったことです。

于 2012-12-18T22:33:35.553 に答える