jqPlot饼图无法正确呈现

Question

我在jqPlot中使用phonegap但是有一些问题就是如果我给pie chart提供静态值那么它运行良好但是如果我给了动态值然后没有正确渲染

静态图表： -

$.jqplot('chartdiv', [ [ [ 'Cricket', 42],
            [ 'Football', 8 ],
            [ 'Basketball', 4 ], [ 'Chess', 28 ],
            [ ' TableTennis', 18 ] ] ], {
        seriesDefaults : {
            renderer : $.jqplot.PieRenderer,
            rendererOptions : {
                showDataLabels : true
            }
        },
        legend : {
            show : true,
            location : 'e'
        }
    });

O / P ： -

动态图表： -

var cricketPortion = document.getElementById("value_1").value;
var footballPortion = document.getElementById("value_2").value;
var basketballPortion = document.getElementById("value_3").value;
var chessPortion = document.getElementById("value_4").value;
var ttPortion = document.getElementById("value_5").value;
$.jqplot('chartdiv', [ [ [ 'Cricket', cricketPortion ],
            [ 'Football', footballPortion ],
            [ 'Basketball', basketballPortion ], [ 'Chess', chessPortion ],
            [ ' TableTennis', ttPortion ] ] ], {
        seriesDefaults : {
            renderer : $.jqplot.PieRenderer,
            rendererOptions : {
                showDataLabels : true
            }
        },
        legend : {
            show : true,
            location : 'e'
        }
    });

O / P ： -

告诉我怎样才能摆脱这个......？

Answer 1

试试这个你会得到结果

对每个值

使用parseInt

parseInt(document.getElementById("value_1").value)

DEMO

Answer 2

使用Javascript的parseInt功能将String值解析为Integers例如：parseInt(document.getElementById("value_1").value)

jqPlot除了一个值（整数）以绘制画布上的部分/分区（无论是饼图，条形图还是任何其他图表）

所以它是[ label(a String), value(an Integer) ]
确保第二个字段的数据类型为Integer类型

希望它有所帮助。