在ie8中打印流图

我目前使用http://www.flotcharts.org/绘图插件。我正在努力实现打印一个flolot图形被内容包围的页面的能力。我试图打开一个新的窗口，打印一个画布对象，这样我就可以打印只是平面图形，我已经成功地做到了这一点。然而，要做到这一点，我需要让画布成为一个图像，这样我就可以在一个新窗口中打开它，因为我不能让flot在一个新窗口中工作。

canvas.toDataURL();

在internet explorer 8中，我得到没有toDataURL()方法的错误。我相信这是因为ie8不支持canvas标签，所以flot必须使用变通方法。那么，我如何在新的浏览器和ie8中打印一个页面的平面图形呢?

我有同样的问题，当我试图打印流线图。打开新窗口的另一种选择是将画布移动到页面顶部，隐藏其他所有内容，打印，然后将所有内容放回原处。这应该可以在现代浏览器和IE8中工作。此外，这将保持你的外部样式和库(jquery/flot)的引用，因为它是在同一个页面上。

的HTML结构:

<body>
    <div id="wrapper">
        <div id="some-element></div>
        <canvas id="my-canvas"></canvas>
        <button type="button" id="print-button">PRINT</button>
        <div id="some-other-element></div>
    </div>
</body>

和javascript函数:

function printContent(whatToPrint, priorSibling, afterSibling) 
{
    $('#wrapper').hide();//hide content wrapper inside of body
    //take what to print out of wrapper and place directly inside body
    $(whatToPrint).appendTo('body');
    window.print();//print the window
    //put everything back
    $('#wrapper').show();
    if (priorSibling != null) 
    {
        $(whatToPrint).insertAfter(priorSibling);
    }
    else if (afterSibling != null)
    {
        $(whatToPrint).insertBefore(afterSibling);
    }
}

和javascript打印按钮事件

$('#print-button').click(function(){
    printContent($('#my-canvas'), $('#some-element'), null);
});

注意:在chrome中打印，不使用系统对话框打印，可能会扰乱你的风格。这只是铬虽然。如果有人有解决办法，请告诉我。

你可能还想尝试Flashcanvas (flashcanvas.net)而不是Excanvas;它应该支持toDataURL

相关内容

最新更新

热门标签：