3

私のアプリケーションには、showCaseの2番目の棒グラフに似たp:barchartグラフがあります:http: //www.primefaces.org/showcase/ui/barChart.jsf

<p:barChart id="horizontal" value="#{chartBean.categoryModel}" legendPosition="se" style="height:300px"  
            title="Horizontal Bar Chart" orientation="horizontal" min="0" max="200"/>

X軸の数値をカスタマイズするにはどうすればよいですか。整数のみを使用するようにx軸をフォーマットしたいと思います。

前もって感謝します。

4

4 に答える 4

6

これを試してください(テストされていません)

<p:barChart extender="ext" id="horizontal" value="#{chartBean.categoryModel}" legendPosition="se" style="height:300px"  
    title="Horizontal Bar Chart" orientation="horizontal"/>

あなたのjsにこれを追加します

function ext() {
   this.cfg.seriesDefaults = { 
       useSeriesColor: true, 
       min: 0, 
       max: 200, 
       tickInterval: 20, 
       tickOptions: { 
           formatString: '%d' 
       } 
   };
}

またはこのx軸のみ:

function ext() {
   this.cfg.axes = {
       xaxis:
       {
           tickInterval: 20,
           tickOptions: { 
               formatString: '%d' 
           } 
       }
   };
}

あなたは遊んでみることができ tickIntervalます...


PrimeFacesユーザーガイドから直接

エクステンダー

チャートは、一般的に使用されるjqplotオプションへの高レベルのアクセスを提供しますが、jqplotにはさらに多くのカスタマイズオプションがあります。エクステンダー機能は、this.cfgオブジェクトを拡張することにより、高度なカスタマイズを行うための低レベルAPIへのアクセスを提供します。これは、一連の線の影の深さを増やす例です。

<p:lineChart value="#{bean.model}" extender="ext" />


function ext() {
    //this = chart widget instance
    //this.cfg = options
    this.cfg.seriesDefaults = {
        shadowDepth: 5
    };
}

使用可能なオプションのドキュメントについては、jqPlotのドキュメントを参照してください。 http://www.jqplot.com/docs/files/jqPlotOptions-txt.html Converter

于 2012-11-25T10:12:55.353 に答える
2

エクステンダー関数は次のようになります

    function customExtender() {
        this.cfg.axes.xaxis.tickOptions = {
            formatString : '%d'
        };
        this.cfg.axes.xaxis.tickInterval = 1;
    }

私は同じ問題を抱えていましたが、これはうまく機能します。Daniel'sAnswerと他のコードに基づいています。このようにして、両方ではなく、目的の軸をフォーマットするだけです。

于 2013-01-23T22:56:22.407 に答える
1

あなたのjsにこれを追加します

function ext() {
    this.cfg.axes.xaxis.tickOptions.formatString = '%d';
}
于 2013-04-17T12:03:09.323 に答える
1

次のコードを使用して、@ManagedBeanクラスから軸にフォーマットを設定できます。

Axis xAxis = categoryModel.getAxis(AxisType.X);
xAxis.setTickFormat("%.0f");
于 2017-01-27T10:18:57.873 に答える