打印整个 Cytoscape.js HTML5 canvas。不仅仅是可见部分

Question

我正在使用 Cytoscape.js 并尝试打印出整个图表，而不仅仅是可见部分。如果用户放大，我希望它能打印很多页。

我能得到的最好的只是可见部分。

我很惊讶 Cytoscape.js 中没有内置打印功能。

<script>
    function printCanvas() {

        var padding = 10; // padding around found objects
        var canvases = $('canvas');
        var context = canvases[2].getContext('2d');
        // find borders of a rectange covering all objects

        var newWidth = canvases[2].width;
        var newHeight = canvases[2].height;

        // create a new canvas
        var newcanvas = document.createElement('canvas');
        newcanvas.width = newWidth + 2 * padding;
        newcanvas.height = newHeight + 2 * padding;
        var newcontext = newcanvas.getContext('2d');

        // copy data to the new canvas
        newcontext.putImageData(context.getImageData(0, 0, newWidth, newHeight), padding, padding);

        popup = window.open();
        popup.document.body.innerHTML = "<img src='" + newcanvas.toDataURL('png') + "' />";

        popup.print();
    }
</script>

Answer 1

您可以将整个图表作为 PNG 或 JPG 图片获取：

cy.png({full: true})

有关详细信息，请参阅 documentation。

打印整个 Cytoscape.js HTML5 canvas。不仅仅是可见部分

Print entire Cytoscape.js HTML5 canvas. Not just visible part

html5-canvas

cytoscape.js