Primefaces 5.2：自定義圖表數據提示

我想自定義Primefaces 5.2圖表中的數據提示。所以這意味着，我想更改datatipFormat及其上的內容。Primefaces 5.2：自定義圖表數據提示

它嘗試這樣做：

--- XHTML ---

<p:chart type="line" 
     model="#{lineChartController.lineModel}" 
     title="#{lineChartController.lineModel.title}" 
     showDatatip="#{lineChartController.lineModel.showDatatip}" 
     datatipFormat="#{lineChartController.datatipFormat}" 
     ... />

--- --- Java的

public String getDatatipFormat() 
{ 
    return "<span style=\"display:none;\">%s</span><span>%s</span>"; 
}

isShowDatatip（）返回true。

自定義datatipFormat似乎不工作，而且我不知道如何把我想要的數據放在％s上。

要恢復：

我有這個Simple Primefaces 5.2 chart datatip
我想這Customized chart datatip from D3.js

感謝

來源

2016-04-22 Quanta

我找到了解決方案。

Here，它導致我錯誤的方向。

我把我的Java代碼放在LineChartController上，我的showDatatip導致一個LineChartModel ...它包含一個setDatatipFormat（String）方法。

於是我就用它：

LineChartModel lineModel = new LineChartModel(); 
... 
lineModel.setDatatipFormat("<table><thead><tr><th>Date</th></tr></thead><tbody><td>%s</td><td>%s EUR</td></tbody></table>");

我仍然不知道如何把我想要的數據在％S。

來源

2016-04-26 12:14:28 Quanta

您可以使用<p:overlayPanel>這個

<p:overlayPanel id="myPanel" for="myLbl" showEvent="mouseover" hideEvent="mouseout"> 
      <p:panelGrid columns="2"> 
       <f:facet name="header">#{controller. getDate()}</f:facet>     
       <h:outputLabel value="#{controller.dataItem.Col1}" />    
       <h:outputLabel value="#{controller.dataItem.Col2}" />  

      </p:panelGrid> 
    </p:overlayPanel>

並在您的圖表中綁定此圖層中所需點的onlay鼠標懸停，您可以從javascript調用overlay並捕獲圖表的mousehover事件。

來源

2016-04-22 09:27:05 techipank

我試過你的代碼，它很好，但是，你知道如何從圖表中檢索信息（例如x和y座標）嗎？因爲否則數據是靜態的。 – Quanta

Primefaces 5.2：自定義圖表數據提示

回答

相關問題