0

Primefacesチャートを扱っているときに問題が発生しました。

問題

折れ線グラフをクリックすると、別の折れ線グラフを含むダイアログが表示されます。

サンプルコード

<p:lineChart id="chartOne" rendered="cond1"/>

<p:dialog widgetVar="dialogOne">
     <p:lineChart id="chartTwo" rendered="cond1"/>
</p:dialog>

<script>
   $('#chartOne').bind('jqplotClick',
        function (ev, seriesIndex, pointIndex, data) {
            dialogOne.show();
        }
   );
</script>

チャートクリックでダイアログを表示できるようになりましたが、ダイアログ内のチャートが更新されません。JavaScript関数によるコンテンツの更新についてはよくわかりません。

Update1:

条件は次のとおりです。chartOneは、(データポイントまたはシリーズだけでなく)キャンバス全体をクリックする必要があります。chartTwoは、 dialogOne.show()が発生した場合にのみレンダリングする必要があります。

どんな助けでも...大いに感謝します

4

2 に答える 2

1

動的ダイアログを使用することは解決策かもしれません。

ドキュメントから:

動的モードでは、ダイアログはページの読み込み時ではなく、表示される前にコンテンツをフェッチできます。これは、最初のページの読み込み時間を短縮するのに役立ちます。デフォルトはfalseです。

ダイアログを次のように定義するだけです。

<p:dialog widgetVar="dialogOne" dynamic="true">

アップデート:

Javascriptからダイアログを更新するには、を使用できますp:remoteCommand。例:

<h:form id="formId">
    <p:dialog id="dialog" />
</h:form>
<p:remoteCommand name="updateDialog" update=":formId:dialog"/>

2番目の更新:

Javascriptからのp:remoteCommand呼び出しを使用します。updateDialog()

于 2012-12-12T13:00:01.287 に答える
0

これを試して:

<p:lineChart id="chartOne" rendered="cond1" >
    <p:ajax event="itemSelect" listener="#{bean.action}" update="chartTwo" oncomplete="dialogOne.show()" />
</p:lineChart>

<p:dialog widgetVar="dialogOne">
     <p:lineChart id="chartTwo" rendered="cond1"/>
</p:dialog>

バッキングBeanの方法action()については、chartTwoのデータを準備する必要があります。

ユーザーマニュアルによると、チャートのクリック可能な部分は、チャート全体ではなく、シリーズになります。小切手

http://www.primefaces.org/showcase-labs/ui/interactiveCharts.jsf

詳細と実際の例については。

于 2012-12-12T11:08:22.650 に答える