primefaces图表x轴

Question

你可以从this site看到问题。

这是我的 index.html 文件的代码：

<h:head></h:head>     
   <h:form>
      <p:outputLabel value="Primefaces Tutorial"></p:outputLabel>
      <p:chart type="bar" model="#{viewEmployeesManagedBean.barModel}" style="height:500px"  xaxisAngle="90" />
   </h:form>
</html>

我在 primefaces 中创建了一个图表 java。 xAxis 重叠。我使用 xaxisAngle。不过好像没什么区别。我该如何解决？

我想要垂直 xAxis 标签。我该怎么办？

Answer 1

重复是指它在模型中做的。但是，您也可以在 javascript 中执行此操作，但您需要使用扩展器功能。在这种情况下如何使用它的一个例子是

JavaScript:

function customExtender() {
 this.cfg.axes = {
  xaxis : {
   renderer : $.jqplot.DateAxisRenderer,
   rendererOptions : {
    tickRenderer : $.jqplot.CanvasAxisTickRenderer
   },
   tickOptions : {
    formatString : '%b %#d, %H:%M:%S',
    angle : 60
   }
  },
  yaxis : {
   rendererOptions : {
    tickRenderer : $.jqplot.CanvasAxisTickRenderer
   },
   tickOptions : {
    fontSize : '10pt',
    fontFamily : 'Tahoma',
    angle : 30
   }

  }

 };
}

ManagedBean

barModel.setExtender("customExtender");

primefaces图表x轴

primefaces chart x axis

jsf

highcharts

primefaces