Fatal编程技术网
  • jsf/
  • Jsf p:chart将所有图表呈现为折线图

Jsf p:chart将所有图表呈现为折线图

jsf primefaces charts

Jsf p:chart将所有图表呈现为折线图,jsf,primefaces,charts,Jsf,Primefaces,Charts,我有一个使用PrimeFaces 6.0的JSF Java应用程序 DeviceManager是一个bean，它包含在线、离线和被阻止设备的列表。每个设备在类中有2个图表模型：拨号和线路。以下是相关的代码部分 <html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:f="http://

我有一个使用PrimeFaces 6.0的JSF Java应用程序 DeviceManager是一个bean，它包含在线、离线和被阻止设备的列表。每个设备在类中有2个图表模型：拨号和线路。以下是相关的代码部分

<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui">

<h:head>
    <title><ui:insert name="title">Title</ui:insert></title>
    <h:outputStylesheet library="css" name="primeui-all.min.css" />
    <h:outputStylesheet library="css" name="bootstrap.min.css" />
    <h:outputStylesheet library="css" name="jquery.jqplot.min.css" />
    <h:outputScript library="js" name="primeui-all.min.js" />
    <h:outputScript library="js" name="jquery.jqplot.min.js"/>
</h:head>



<p:dataTable id="OnlineDevices" var="device" value="#{DeviceManager.online}">
    <p:column headerText="Gauge Meter" class="col-md-4" >
            <p:panel>
                <p:chart type="metergauge" model="#{device.dial}" style="height:300px;"/>
            </p:panel>
    </p:column>
</p:dataTable> 


标题
这是包含图表模型的设备类，该模型是从Primefaces showcase复制的，用于消除模型中的任何问题

private MeterGaugeChartModel Dial;
public MeterGaugeChartModel getDial()
{
    Dial = initMeterGaugeModel();
    Dial.setTitle("Device Dial");
    Dial.setGaugeLabel("°C");
    Dial.setSeriesColors("66cc66,93b75f,E7E658,cc6666");
    Dial.setGaugeLabelPosition("bottom");
    Dial.setShowTickLabels(false);
    Dial.setLabelHeightAdjust(110);
    Dial.setIntervalOuterRadius(100);
    return Dial;

}

private MeterGaugeChartModel initMeterGaugeModel() 
{
    List<Number> intervals = new ArrayList<Number>()
    {   
        private static final long serialVersionUID = -311244463402628794L;

    {
        add(20);
        add(50);
        add(120);
        add(220);
    }};

    return new MeterGaugeChartModel(140, intervals);
}

private MeterGaugeChartModel拨号；
公共MeterGaugeChartModel getDial（）
{
Dial=initMeterGaugeModel（）；
拨号。设置标题（“设备拨号”）；
刻度盘设置仪表标签（°C”）；
拨号设置颜色（“66cc66,93b75f，E7E658，cc6666”）；
刻度盘设置仪表标签位置（“底部”）；
拨号设置显示标签（假）；
刻度盘设置高度调整（110）；
拨号设置间隔（100）；
回拨盘；
}
私有MeterGaugeChartModel initMeterGaugeModel（）
{
列表间隔=新建ArrayList（）
{   
私有静态最终长serialVersionUID=-311244463402628794L；
{
增加（20）；
增加（50）；
增加（120）；
增加（220）；
}};
返回新的MeterGaugeChartModel（140，间隔）；
}
现在，这可以工作了，并且打印，只有所有打印都呈现为空折线图。折线图可以正常工作并打印，但其他所有内容都呈现为空折线图。我使用了一个轮询表单来更新图表数据，并使用firebug检查从服务器发送的数据，它说键入metergauge。那么，为什么它（连同所有其他东西）渲染成线条呢？非常感谢各位，我们非常感谢并欢迎所有建议。

所有自动包含的primefaces js（包括图表的jqplot）与手动包含的jqplot和primeui css和js之间存在冲突。去掉它，它就可以正常工作。

这样它就可以使用PrimeFaces 5.3了？为什么要手动包含所有jqplot css和js？为什么使用primeui js和css？奇怪的组合。首先移除它。好了，现在可以了。。。这是一个模板的标题，我不知道为什么会这样。。。作为答案提交，我将接受并感谢万分之一的关注！！如果您按照创建see的步骤进行操作，那么您自己也可以很容易地发现这一点