jqplot图表的多维数组

时间:2012-02-16 22:14:45

标签: javascript jquery jsp jstl jqplot

我正在尝试创建Jqplot条形图,并且难以在类似

中创建多维数组
   var plot2 = $.jqplot('chart2', [
    [[2,1], [4,2], [6,3], [3,4]], 
    [[5,1], [1,2], [3,3], [4,4]], 
    [[4,1], [7,2], [1,3], [2,4]]],

我的数据位于hashMap内的HashMap中,就像

 {software={low=1,high=5, medium=4}, harware={low=3,high=3},network{low=3,high=3,medium=8}}

如何在上面的多维数组中解释我的数据。

我已经编写了以下代码来实现这个目标

 $(document).ready(function(){  
    <c:forEach var="data" varStatus="main" items="${data}">  

    var cdata = new Array();

    var twoDOuterArray = new Array(${data.size()});

    <c:forEach var="mapEntry" varStatus="status" items="${data['cData']}">
        twoDOuterArray[${status.index}] = new Array(3);
    </c:forEach>

    <c:forEach var="mapEntry" varStatus="status" items="${data['cData']}">
    <c:forEach var="dataValue" varStatus="status2" items="${mapEntry.value}">
        var valueArray = new Array();           
        alueArray.push(${dataValue.value});
        valueArray.push("${mapEntry.key}");
        twoDOuterArray[${status2.index}][${status.index}]=valueArray;
    </c:forEach>
    //alert(twoDOuterArray[${status.index}].length);
    </c:forEach>



    data.push(twoDOuterArray);

    alert(twoDOuterArray);

    plot2b = $.jqplot('chart2', data, {
        seriesDefaults: {
            renderer:$.jqplot.BarRenderer,
            pointLabels: { show: true, location: 'e', edgeTolerance: -15 },
            shadowAngle: 50,
            rendererOptions: {
                barDirection: 'horizontal'
            }
        },
        title:{
            text: "${title}",                    
            show: true,               
            textColor:"#fff",
        },
        axes: {
            yaxis: {
                renderer: $.jqplot.CategoryAxisRenderer
            }
        },
        legend: { show:true, location: 'e' }
    });


    );

</c:forEach>
});

似乎格式是正确的,但我不明白我错在哪里,或者这是创建数据的正确方法。如果有人能帮助我解决这个问题,那就太好了。

编辑: 我如何检查我的数组是否以上述要求的格式创建?

1 个答案:

答案 0 :(得分:2)

要查看您的数据是什么样的,我会使用Firebug(或您最喜欢的浏览器的等价物)在调用jqplot时设置断点。然后检查要检查的变量。

似乎jqplot应该使用twoDOuterArray,但是你传递它data这可能是个问题。

还有一件事:如果原始数据对象包含多个元素,那么外部<c:forEach>将导致jqplot在先前生成的图上覆盖新图。

我不建议将JSTL与Javascript混合使用,而是建议在设置其他变量的地方构建二维数组(例如:控制器)。然后使用类似Gson的库将对象转换为JSON,并将其直接传递给jqplot。