jqPlot 如何从 java arraylist 和 JSF bean 制作图表



我一直在使用Primefaces图表并取得了一些成功,但我想了解更多关于jqPlot的信息,以便我可以进行更灵活的自定义。一个例子是我想创建一个组合图(条形图和折线图组合)。

我希望通过从XHTML页面触发jQuery函数来创建图表:

<button type="button" class="button" onclick="comboChart()">Combo Chart</button>

函数为:

function comboChart() {
var line1 = [#{chartDataBean.comboChartMapList}];
var line2 = [#{chartDataBean.linePartChartMap}];
var plot2 = $.jqplot('testchart', [line1, line2], {
series: [{renderer: $.jqplot.BarRenderer}, {xaxis: 'x2axis', yaxis: 'y2axis'}],
axesDefaults: {
tickRenderer: $.jqplot.CanvasAxisTickRenderer,
tickOptions: {
angle: 30
}
},
axes: {
xaxis: {
renderer: $.jqplot.CategoryAxisRenderer
},
x2axis: {
renderer: $.jqplot.CategoryAxisRenderer
},
yaxis: {
autoscale: true
},
y2axis: {
autoscale: true
}
}
});
};

JSF bean 包含一个映射数组列表,其中每个映射将是一个系列:

public List<HashMap<Object, Double>> getComboChartMapList() {
List<List<Endatapoint>> modbinholder = new ArrayList<List<Endatapoint>>
();
modbinholder = anBean.getModelBinList();
comboChartMap = new HashMap<>();
comboChartMapList = new ArrayList<>();
for (List<Endatapoint> cList : modbinholder) {
List<Endatapoint> pholder = new ArrayList<>();
pholder = cList;
for (Endatapoint p : pholder) {
Date lDate = p.getPointdate();
String pnits = p.getRecords().getSnipunit();
Double aNum = p.getActualnum();
comboChartMap.put(pnits, aNum);
comboChartMapList.add(comboChartMap);
}
}
return comboChartMapList;
}

上面只是生成一个没有数据的空白图表。查看Chrome和FF(Firebug)中的JS控制台,我注意到一个语法错误,其中列表值生成如下:

var line1 = [[{Million Dollars=54.7}, {Million Dollars=54.7}]];

但是 jqplot 文档要求像这样生成值:

var line1 = [['Million Dollars', 54], ['Million Dollars', 54.7]];

我的问题是:

  1. 我在上面的代码中做错了什么?
  2. 我可以使用上面的代码传递正确的值,还是需要使用任何其他方法,如 JSON?

我在这里读到的大多数示例和问题似乎都涉及将动态值传递给jplot的JSON。如果可能的话,我想坚持只使用 Java 对象。

Json是必需的,PrimeFaces或带有注释的rest接口可以为您执行此操作,只需创建一个进行转换的getter

最新更新