如何讓兩個Primefaces元素像MeterGaugeChartModel相鄰？

我從Primefaces獲得了兩個MeterGaugeChartModel。目前一個在另一個之下，但我希望他們彼此相鄰。我怎樣才能做到這一點？如何讓兩個Primefaces元素像MeterGaugeChartModel相鄰？

<p:panel header="Capacity Charts"> 
    <p:meterGaugeChart id="CPUchart" value="#{chartBean.meterGaugeModelCPU}" 
        showTickLabels="false" labelHeightAdjust="110" intervalOuterRadius="130" 
        seriesColors="66cc66, 93b75f, E7E658, cc6666" style="width:400px;height:250px" 
        title="CPU" label="percentage (%)"/> 
    <p:meterGaugeChart id="RAMchart" value="#{chartBean.meterGaugeModelRAM}" 
        showTickLabels="false" labelHeightAdjust="110" intervalOuterRadius="130" 
        seriesColors="66cc66, 93b75f, E7E658, cc6666" 
        style="width:400px;height:250px" 
        title="RAM" label="percentage (%)"/> 
</p:panel>

來源

2013-03-15 Teysz

爲什麼不把它們都放在'」'中？ – kolossus 2013-03-15 12:38:44

我認爲你正在尋找@kolossus提出的解決方案。在showcase website of Primefaces你可以找到很多這樣的解決方案的例子，如first example。

<p:panel header="Capacity Charts"> 
    <h:panelGrid columns="2"> 
     <p:meterGaugeChart id="CPUchart" ... /> 
     <p:meterGaugeChart id="RAMchart" ... /> 
    </h:panelGrid> 
</p:panel>

這會將panelGrid的所有子元素添加到下一列。因此，添加另一個<p:meterGaugeChart />將把它添加到下面一行的第一列。

來源

2013-03-15 14:06:54

首先，@kolossus提出了一個很好的JSF式的解決方案：附上組件面板中的網格。我也會這樣做。

如果你不想讓你可以用一個非常簡單的CSS任何額外 JSF組件：添加float:left既米軌組件，並添加一個額外的<div style="clear:both">：

<p:panel header="Capacity Charts"> 
    <p:meterGaugeChart id="CPUchart" style="float:left;" ... /> 
    <p:meterGaugeChart id="RAMchart" style="float:left;" ... /> 
    <div style="clear:both"></div> 
</p:panel>

來源

2013-03-15 13:54:15 skuntsel

如何讓兩個Primefaces元素像MeterGaugeChartModel相鄰？

回答

相關問題