PrimeFaces：将图表导出为图片

问题描述

我正尝试在展示柜之后将我的PF图表导出为图片：

I'm trying to export my PF chart as picture following the showcase:

<h:form id="form1">
    <p:chart type="line" value="#{chartView.lineModel1}" 
             style="width:500px;height:300px" 
             widgetVar="chart"/>

    <p:commandButton type="button" 
                     value="Export" 
                     icon="ui-icon-extlink" 
                     onclick="exportChart()"/>

    <p:dialog widgetVar="dlg" 
              showEffect="fade" 
              modal="true" 
              header="Chart as an Image" 
              resizable="false">
        <p:outputPanel id="output" 
                       layout="block" 
                       style="width:500px;height:300px"/>
    </p:dialog>
</h:form>
<script type="text/javascript">
    function exportChart() {
        //export image
        $('#output').empty().append(PF('chart').exportAsImage());

        //show the dialog
        PF('dlg').show();
    }
</script>

但是弹出窗口为空白：

我正在使用 PF v5.1 ，但我尝试了两种方法：

I'm using PF v5.1 but I've tried both the approaches:

用于 PF v3.5 或更旧版本：

$('#output').empty().append(chart.exportAsImage()); dlg.show();  

$('#output').empty().append(PF('chart').exportAsImage()); PF('dlg').show();

我在做什么错了？

推荐答案

这是解决方案：

function exportChart() {
  $('#form1\\:output').empty().append(chart.exportAsImage());
  dlg.show();
}

这篇关于PrimeFaces：将图表导出为图片的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！