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"/>

用户Bean

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 格式化工具提示的字符串,因此您只能打印第二个参数(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 回答
1

只能显示 x 值的前 0 个字符(%.0s),隐藏它是什么意思。在它后面你可以用 sprintf 格式的 y 值做你想做的事。

yourBarChartModel.setDatatipFormat("%.0s%s");
于 2018-05-07T12:38:58.067 回答