JSF、HighCharts 和 JS [英] JSF, HighCharts and JS

问题描述

我想在我的项目中同时使用 highcharts 和 jsf.我有一个 managedbean，它有一个列表，它由外观初始化(它在我的数据库中进行查询).如果我想将列表的值传递给 highcharts，该怎么做?如果有人有好主意，请分享.

I would like to use in my project highcharts and jsf both. I have a managedbean, which has a list and it is initializing by a facade (it do a query in my database). If I'd like to pass the value of the list to highcharts, how can do this? if anyone has a good idea, please share.

最好的问候和非常感谢

推荐答案

没用过 highcharts ，但我用过其他图表库...

Haven't worked with highcharts , but I did with other charting library...

我将向您提供有关如何将基于 js 的图表目录与 JSF 结合的一般说明(我确定还有其他方法，例如使用 servlet 等...)

I'll give you general Instructions on how to combine js based charting directory it with JSF (I'm sure that there are others way's like using servlets and etc...)

1) 在您的 JSF 项目中构建一个有效的硬编码"js 示例包含库所需的相关 *.js 文件添加页面所需的容器"div最后编写使用硬编码值构建图表的 js 脚本

1) build a working "hard coded" js only example in your JSF project include the relevant *.js files needed by the library add the "container" div that is required to your page and finally wrtie the js script that build your chart with hard coded values

2) 将您的硬编码值放入您的 Bean String 属性中，并在您的 .xhtml 页面中放置一个对该属性的引用，类似于 <h:inputHidden id="chart_input_data" value="#{myBean.valueOfChart}"/> 并在您的 js 代码中访问它

2) place your hard coded values into your Bean String property and place a ref' to that property in your .xhtml page something like that <h:inputHidden id="chart_input_data" value="#{myBean.valueOfChart}" /> and access it in your js code like that

//I used jQuery selectors....
var data_for_chart = $('input[id$="chart_input_data"]').val(); //you can use a simpler selector like $("#chart_input_data") too

然后使用变量 data_for_chart 作为图表 series 输入(或图表构造函数的任何参数)

than use the variable data_for_chart as chart series input (or for whatever parameter of your chart constructor)

3) 最后，我猜您想将一些 Pojos 列表转换为适当的 json 格式，这最像 HigthCharts 构造器的像手套一样适合"，这可以通过 Gson 类似于 gson.toJson(yourListOfValues) 的库，请参阅 Gson使用指南

3) finally I guess you would like to turn some list of Pojos into a proper json format which is most like wold "fit like a glove" for the HigthCharts constractor , this you can achieve with Gson library something like gson.toJson(yourListOfValues) see Gson user guide

注意

此技术适用于所有图表库，例如 flot 、 flotr2 、 gRaphael 、 jqPlot 和更多...

This technique should work for all charting library's , such as flot , flotr2 , gRaphael , jqPlot and more...

这篇关于JSF、HighCharts 和 JS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！