我将解释客户端发起请求的情况,其中当发出请求时图表将显示在浏览器上。这是标准情况,mxGraph 使用自定义图形基元传输图形的 XML 表示形式,这些表示形式在服务器上接收并由 Java 或 .NET 后端进行解码。
需要显示图表的原因是某些文本测量很难在浏览器环境之外重新创建。
在客户端,您需要使用以下命令创建所需的即时 XML:图编辑器.html https://jgraph.github.io/mxgraph/javascript/examples/editors/diagrameditor.html作为指导的示例:
var exportImage = function(editor)
{
var graph = editor.graph;
var scale = graph.view.scale;
var bounds = graph.getGraphBounds();
// New image export
var xmlDoc = mxUtils.createXmlDocument();
var root = xmlDoc.createElement('output');
xmlDoc.appendChild(root);
// Renders graph. Offset will be multiplied with state's scale when painting state.
var xmlCanvas = new mxXmlCanvas2D(root);
xmlCanvas.translate(Math.floor(1 / scale - bounds.x), Math.floor(1 / scale - bounds.y));
xmlCanvas.scale(scale);
var imgExport = new mxImageExport();
imgExport.drawState(graph.getView().getState(graph.model.root), xmlCanvas);
// Puts request data together
var w = Math.ceil(bounds.width * scale + 2);
var h = Math.ceil(bounds.height * scale + 2);
var xml = mxUtils.getXml(root);
// Requests image if request is valid
if (w > 0 && h > 0)
{
var name = 'export.png';
var format = 'png';
var bg = '&bg=#FFFFFF';
new mxXmlRequest(editor.urlImage, 'filename=' + name + '&format=' + format +
bg + '&w=' + w + '&h=' + h + '&xml=' + encodeURIComponent(xml)).
simulate(document, '_blank');
}
};
Where editor.urlImage
在 Java 后端的情况下,是图像生成 servlet 的 URL。
在服务器端,如果是 Java,请查看 java/examples/com/mxgraph/examples/web/ExportServlet.java。它查看传递的“格式”参数,如果是“pdf”,则writePdf()
方法被调用。
该方法创建了一个PDF书写器 https://github.com/jgraph/OpenPDF并使用 mxGraph 中 Java 喜欢的部分将图形基元渲染为 Java Swing Graphics2D。
此示例将 PDF 结果直接写入以下行中 servlet 响应的输出:
PdfWriter writer = PdfWriter.getInstance(document, response.getOutputStream());
您可以将输出映射到任何流。
请注意,您需要设置 iText 来映射 PDF 中所需的每种字体。对于大量字体来说,这并不总是理想的。值得测试一些导出案例,看看输出是否足以满足您的要求。我们目前正在研究使用PhantomJS http://phantomjs.org/用于出口。如果 Java 导出不够好,请发布另一个有关使用 PhantomJS 的问题,我将详细介绍该过程。
iText 作为示例 PDF 库提供,使用起来更容易,因为它位于开源库下。它可能不是最适合的库,我们发现它对于这个特定场景来说并不容易使用。您可能还想研究其他 Java PDF 生成库。
另请注意,.NET 后端仅支持 dotnet/aspnet/Export.ashx 中的光栅图像生成,没有已知的开源 PDF 库可作为示例。