Question

有没有人有任何想法如何将EXT JS图表导出为PDF进行打印？我无法在网上找到解决方案。

Answer 1

以下是我如何做的基本步骤。

使用Chart.Save方法获取要导出的图表的SVG内容。
将SVG内容发送到服务器
在服务器端，您可以使用 rsvg-convert 或类似的库来进行PDF转换。

Answer 2

//将此组件插入表单项以进行打印

{
                        xtype: 'button',
                        tooltip: getTranslate('{Print}'),
                        icon: getImg(16, 'printer'),
                        handler: function(comp) {

                                var obj  = me.down('chart');
                                var el   = obj.getEl();
                                me.print(el.getHTML(), getTranslate('{CashFlow}'));     
                        }
}

//打印图表功能

function  printChart(html, title) {


        var footerStyle = '#img {vertical-align:middle;} #footer {position:absolute; left: 0; right: 0; bottom: 0; height: 60px; margin-top: 40px; text-align: center; border:none; font-size: 10pt; border-top: 1px solid #000000;} ';
        var noteStyle   = '.note{display: block;' +
                                'padding: 10px;background-color: #F2F2F2;border-radius: 5px;box-shadow: 3px 3px 3px 0 rgba( 178, 178, 178, .5 );' +  
                                'font-family: "Verdana", cursive, sans-serif;font-size:10px;color:#000;border:1px solid #000;' + 
                                'outline:0;max-width: 300px;}';

        var css = '<style>' + footerStyle + noteStyle + '</style>';        

        //var tela_impressao = window.open('about:blank');        

        var leftCenter = (screen.width-100) / 2;
        var topCenter  = 0; //screen.height / 2;

        var tela_impressao = window.open('about:blank','_blank', 'toolbar=no,status=no,menubar=no,scrollbars=no,resizable=no,left=' + leftCenter + ', top=' + topCenter + ', width=100, height=10, visible=false', ''); 

        var logoImg = '<img id="img" width="90px" height="45px" src="/servicos/interface/cognitus.png"/>';
        var footer =  '<div id="footer">' + logoImg + '<span></span></div>';

        var xhtml = '<html><head><title>' + title + '</title>' + css + '</head><body>' + html + footer + '</body>';

        tela_impressao.document.write(xhtml);

        var myTimer;
        var myFunc = function(){

            tela_impressao.window.print(); // sem timer não carrega imagem para preview
            tela_impressao.window.close();

            timerStop(myTimer);
        };

        myTimer = timerRun(myFunc, 100);           

}     

// Executa uma função no intervalo de milesegundos
function timerRun(func, milliseconds) {
    return setTimeout(func, milliseconds);
}

// Para a execução do time
function timerStop(timerVariable) {
    clearTimeout(timerVariable);
}

将图表导出为PDF以打印EXT JS 4

2 个答案: