如何在模态中显示主要图表?

时间:2016-06-11 17:00:49

标签: javascript jsf primefaces charts size

我使用javascript生成图像并以模态显示结果,但模式的图像离开:http://s2.subirimagenes.com/imagen/9603018modal.png

这是我的代码:

XHTML

<h:form id = "form1">
    <p:chart widgetVar="chart" style="width:1200px;height:400px" type = "bar" model="#{graphicBean.barModel}" rendered="#{not empty graphicBean.barModel}"/>
    <p:commandButton onclick ="exportChart()" value = "Execute"/>
    <b:commandButton class="btn btn-primary" value="Show" ajax="true" oncomplete="$('.modalGraphic').modal();return false;" />
</h:form>

<b:modal id="id_modalGraphic" styleClass="modalGraphic" title="Guarda el gráfico">
     <h:form id = "resultado">
         <h:panelGroup id="output" layout="block" style="width:100px;height:100px"></h:panelGroup>
    </h:form>
</b:modal>

的JavaScript

function exportChart() {
  $('#resultado\\:output').empty().append(PF('chart').exportAsImage());
}

我想要一张带有滚动条的简短图片或原始大小的图片。

谢谢!

1 个答案:

答案 0 :(得分:0)

我想你可以这样试试:

<p:commandButton value="Modal" type="button" onclick="PF('dlg2').show();" />

<p:dialog header="Modal Dialog" widgetVar="dlg2" modal="true" height="100">

    here goes what you want to show in the modal

</p:dialog> 

这是使用primefaces