PrimeFaces 饼图:工具提示未显示在我的本地环境中
PrimeFaces Piechart: Tooltips are not displaying in my local environment
我重新创建了 primefaces 展示中显示的示例页面:
http://www.primefaces.org/showcase/ui/chart/pie.xhtml
饼图成功显示,我可以为可用的 setter 和 getter 调整饼图模型,但将鼠标悬停在一块饼图上根本不显示任何工具提示。
这不是浏览器问题,因为工具提示在同一浏览器中显示在演示站点上。
jqplot-highlighter-tooltip div 显示在 html 源中,但悬停时未更新。 javascript 控制台中没有显示任何错误。
我正在使用 5.2 maven 依赖项,也尝试过 4.0 - 但没有任何变化。
如有任何想法,我们将不胜感激。
谢谢。
托管bean的代码如下:
package org.primefaces.examples;
import org.primefaces.model.chart.PieChartModel;
import javax.annotation.PostConstruct;
import javax.faces.bean.ManagedBean;
import java.io.Serializable;
@ManagedBean
public class ChartView implements Serializable {
private static final long serialVersionUID = 1075867144472594293L;
private PieChartModel pieModel1;
private PieChartModel pieModel2;
@PostConstruct
public void init() {
createPieModels();
}
public PieChartModel getPieModel1() {
return pieModel1;
}
public PieChartModel getPieModel2() {
return pieModel2;
}
private void createPieModels() {
createPieModel1();
createPieModel2();
}
private void createPieModel1() {
pieModel1 = new PieChartModel();
pieModel1.set("Brand 1", 540);
pieModel1.set("Brand 2", 325);
pieModel1.set("Brand 3", 702);
pieModel1.set("Brand 4", 421);
pieModel1.setTitle("Simple Pie");
pieModel1.setLegendPosition("w");
}
private void createPieModel2() {
pieModel2 = new PieChartModel();
pieModel2.set("Brand 1", 540);
pieModel2.set("Brand 2", 325);
pieModel2.set("Brand 3", 702);
pieModel2.set("Brand 4", 421);
pieModel2.setTitle("Custom Pie");
pieModel2.setLegendPosition("e");
pieModel2.setFill(false);
pieModel2.setShowDataLabels(true);
pieModel2.setDiameter(150);
}
}
查看页面的代码为:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui">
<h:head/>
<h:body>
<p:chart type="pie" model="#{chartView.pieModel1}" style="width:400px;height:300px" />
<p:chart type="pie" model="#{chartView.pieModel2}" style="width:400px;height:300px" />
</h:body>
</html>
我遇到了同样的问题。使用扩展器修复它:
小脸:
<script type="text/javascript">
function pieExtender() {
this.cfg.highlighter = {
show: true,
tooltipLocation: 'n',
useAxesFormatters: false,
formatString: '%s = %d'
};
}
</script>
托管 Bean:
pieModel.setExtender("pieExtender");
有关更多调整,请参阅:http://www.jqplot.com/docs/files/plugins/jqplot-highlighter-js.html
我重新创建了 primefaces 展示中显示的示例页面:
http://www.primefaces.org/showcase/ui/chart/pie.xhtml
饼图成功显示,我可以为可用的 setter 和 getter 调整饼图模型,但将鼠标悬停在一块饼图上根本不显示任何工具提示。
这不是浏览器问题,因为工具提示在同一浏览器中显示在演示站点上。
jqplot-highlighter-tooltip div 显示在 html 源中,但悬停时未更新。 javascript 控制台中没有显示任何错误。
我正在使用 5.2 maven 依赖项,也尝试过 4.0 - 但没有任何变化。
如有任何想法,我们将不胜感激。
谢谢。
托管bean的代码如下:
package org.primefaces.examples;
import org.primefaces.model.chart.PieChartModel;
import javax.annotation.PostConstruct;
import javax.faces.bean.ManagedBean;
import java.io.Serializable;
@ManagedBean
public class ChartView implements Serializable {
private static final long serialVersionUID = 1075867144472594293L;
private PieChartModel pieModel1;
private PieChartModel pieModel2;
@PostConstruct
public void init() {
createPieModels();
}
public PieChartModel getPieModel1() {
return pieModel1;
}
public PieChartModel getPieModel2() {
return pieModel2;
}
private void createPieModels() {
createPieModel1();
createPieModel2();
}
private void createPieModel1() {
pieModel1 = new PieChartModel();
pieModel1.set("Brand 1", 540);
pieModel1.set("Brand 2", 325);
pieModel1.set("Brand 3", 702);
pieModel1.set("Brand 4", 421);
pieModel1.setTitle("Simple Pie");
pieModel1.setLegendPosition("w");
}
private void createPieModel2() {
pieModel2 = new PieChartModel();
pieModel2.set("Brand 1", 540);
pieModel2.set("Brand 2", 325);
pieModel2.set("Brand 3", 702);
pieModel2.set("Brand 4", 421);
pieModel2.setTitle("Custom Pie");
pieModel2.setLegendPosition("e");
pieModel2.setFill(false);
pieModel2.setShowDataLabels(true);
pieModel2.setDiameter(150);
}
}
查看页面的代码为:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui">
<h:head/>
<h:body>
<p:chart type="pie" model="#{chartView.pieModel1}" style="width:400px;height:300px" />
<p:chart type="pie" model="#{chartView.pieModel2}" style="width:400px;height:300px" />
</h:body>
</html>
我遇到了同样的问题。使用扩展器修复它:
小脸:
<script type="text/javascript"> function pieExtender() { this.cfg.highlighter = { show: true, tooltipLocation: 'n', useAxesFormatters: false, formatString: '%s = %d' }; } </script>
托管 Bean:
pieModel.setExtender("pieExtender");
有关更多调整,请参阅:http://www.jqplot.com/docs/files/plugins/jqplot-highlighter-js.html