9

今日、新しい PrimeFaces リリース 3.4.RC1 を試してみました。グラフには、datatipFormat という新しい属性があります。

折れ線グラフの値 (y 軸) のみをデータヒントとして表示したい。このような：

<p:lineChart value="#{...}" datatipFormat="y-value"/>

これだけ見せるにはどうしたらいいですか？テンプレート文字列の例が見つかりませんでした。

宜しくお願いします

4

5 に答える 5

18

Primefacesは、チャートにjqPlotライブラリを使用します。そこで、次のエントリを見つけました。

私が試したHighlighter.formatString

（Primefaces Showcaseの例）：

   <p:lineChart  id="basic" value="#{userBean.categoryModel}" legendPosition="ne" 
   datatipFormat="#{userBean.datatipFormat}"  title="Basic Bar Chart" min="0"
    max="200" style="height:300px"/>

UserBean

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

このちょっとしたコツは、y軸の表示だけです。

于 2012-08-22T09:05:41.463 に答える
10

extenderすべての PrimeFaces チャート タグのプロパティを使用して、デフォルトのプロット オプションをオーバーライドできます。例：

<script type="text/javascript">
  function customExtender() {
    this.cfg.highlighter = {
      useAxesFormatters: false,
      tooltipAxes: 'y'
    }
  }
</script>
...
<p:lineChart extender="customExtender" value="..." />

他の利用可能な jqplot オプションはhttp://www.jqplot.com/docs/files/jqPlotOptions-txt.htmlにありますが、ドキュメントには古いと書かれていることに注意してください。

于 2012-10-24T11:54:55.213 に答える
4

datatipFormat は sprintf を使用してツールチップの文字列をフォーマットするため、2 番目のパラメーター (y 軸) のみを出力できます。

<p:lineChart value="#{...}" datatipFormat="%2$d"/>
于 2014-02-05T03:19:32.543 に答える
3

BarChartModel() のヒント:

public String getDatatipFormatX() {
    return "<font size=4 color=blue><span style=\"display:none;\">%s</span><span>%s</span></font>";
}

Horizo​​ntalBarChartModel() のヒント:

public String getDatatipFormatY() {
    return "<font size=4 color=blue><span>%s</span><span style=\"display:none;\">%s</span></font>";
}

使用例:

private void MyCharts(){

//get data (from database, for example) to be displayed

myBarChartModel = new BarChartModel();
myHorizontalBarChartModel = new HorizontalBarChartModel();

ChartSeries verticalSeries = new ChartSeries("verticalSeries");
ChartSeries horizontalSeries = new ChartSeries("horizontalSeries");

myBarChartModel.addSeries(verticalSeries);
myHorizontalBarChartModel.addSeries(horizontalSeries);

myBarChartModel.setDatatipFormat(getDatatipFormatX());
myHorizontalBarChartModel.setDatatipFormat(getDatatipFormatY());
//other chart settings...

}

次に、JSFページで:

<p:chart type="bar" model="#{chartBean.myBarChartModel}" />
<p:chart type="bar" model="#{chartBean.myHorizontalBarChartModel}" />
于 2015-03-09T15:05:18.913 に答える