mxGraph 可以将图表导出为 PDF 吗?

2024-01-03

我正在开发一个使用 mxGraph 的项目,其中需要我导出 PDF 格式的高分辨率输出以获取服务流程图。我尝试使用 Java Swing 客户端 JGraphX 重新创建图形并将其导出为 PDF,但结果与浏览器显示的结果并不接近。

客户端上的 JavaScript 中没有 PDF 导出功能,mxGraph 是否明确支持从 JavaScript 生成 PDF?


我将解释客户端发起请求的情况,其中当发出请求时图表将显示在浏览器上。这是标准情况,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 库可作为示例。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

mxGraph 可以将图表导出为 PDF 吗? 的相关文章

  • TinyMCE 输入以相反顺序写入

    我面临这个问题 每当我输入 TinyMCE 时 我的光标会自动向左移动 最终从右向左写入文本 它只发生在我部署的应用程序中 但如果我在我的机器上本地运行代码 同样可以正常工作 发生这种情况的任何可能原因 相同的屏幕截图 https i st
  • 使用 ScriptEngine 从 JavaScript 调用 Java 方法

    我正在使用 ScriptEngine 运行 JavaScript 我希望 JavaScript 脚本能够调用 myFunction 其中 myFunction 是我的给定类中的一个方法 我知道可以将 importPackage 用于标准 J
  • 使用最新 Ember Data 版本中的 RESTSerializer 格式化 JSON

    我正在努力将我的 JSON munge 成正确的格式 为了说明这一点 我做了一个快速的 JSfiddle http jsfiddle net chrismasters NQKvy 638 http jsfiddle net chrismas
  • Yeoman-Angular 生成的应用程序中缺少 Angular 脚本

    我已经使用 Yeoman Angular Generator 生成了一个应用程序 但项目中缺少 angular js 和其他 Angular 文件 我可以在 Bower json 文件中看到这些依赖项 如下所示 name mi portfo
  • 使用 JavaScript 填写 PDF 表单

    这就是我所拥有的 用户填写很长的 html 表单 用户获取下载不同 pdf 的链接 这是可填写的表格 链接是使用 javascript 生成的 用户单击链接 生成 url 使用用户之前提交的数据 在表单中处理数据并完成字段 这是在表单内使用
  • 使用 word_number 值对 javascript 数组进行排序

    如何对数组进行排序 var arr new Array word 12 word 59 word 17 这样我得到 word 12 word 17 word 59 Thanks 您需要编写一个排序方法 您可以编写任何您喜欢的方法 该方法在
  • TypeScript 中类和命名空间的区别

    到底有什么区别classes and namespaces在打字稿中 我知道 如果您创建一个带有静态方法的类 您可以在不实例化该类的情况下访问它们 这正是我猜想的命名空间的要点之一 我还知道你可以创建多个同名的命名空间 并且它们的方法在编译
  • Ember.js 数组作为模型的属性

    干杯 我有一些模型 它的一个属性是一个数组 但由于某些原因 我在服务器上使用 mongoDB 并且它是嵌入式模型和 ember data 的问题 我不能做这样的事情 App Foo DS Model extend numbers DS ha
  • 使用 getElementById 在 javascript 中使用正则表达式进行 Html 表单验证?

    我想使用正则表达式验证 html 表单的示例模式 AAA 111 2222 aa 1234 目前 我的代码要么为所有输入返回 正确 要么为所有输入返回 不正确 并且我无法弄清楚我的问题出在哪里 var x document getEleme
  • 拖放图像上传在服务器上不起作用

    我正在尝试实现拖放图像上传 我在网上找到了一个相当简单的脚本并适合我的使用 在我的本地安装中 文件上传得很好 但在服务器上却不行 从我的调试尝试来看 SERVER HTTP X FILENAME 甚至没有被 php 设置 我尝试了以下方法
  • Javascript 根据字段值任意排序数组

    所以我有一个对象数组 如下所示 var myArray priority low priority critical priority high 我需要以这种方式排序 1 关键 2 高和3 低 如何才能做到这一点 我建议使用一个对象来存储排
  • jQuery 问题:它的真正含义是什么?

    function window undefined jquery code jQuery window 它到底意味着什么 是不是也意味着 document ready 或者只是两种不同的东西 已经有两个答案 但这是我对代码缺失端的猜测 fu
  • Angular UI.Bootstrap 单选按钮在 ng-repeat 中表现得很奇怪[重复]

    这个问题在这里已经有答案了 我在 Angular 的 ui bootstrap 中动态生成无线电模型的选项时遇到问题 我想我可以简单地对数组进行 ng repeat 使用 btn radio 属性的内容 如下所示 in the contro
  • 函数声明或函数表达式

    我刚刚在块作用域中定义函数时遇到了问题 考虑以下程序 try greet function greet alert Merry Christmas catch error alert error 我希望这个程序能够发出警报Merry Chr
  • 如何在 Astro 中的组件之间共享状态?

    我相信我在代码中采用了错误的方法 如何在按钮单击中设置客户端首选项 该按钮单击用作全局 astro 组件中的道具 或者我应该怎么做 我知道这是可能的 因为 astro js 本身在他们的文档网站中这样做了 下面是我的尝试的解释 我目前正在开
  • Javascript/DOM:如何删除 DOM 对象的所有事件侦听器?

    只是问题 有没有办法完全删除对象的所有事件 例如一个div 编辑 我添加每div addEventListener click eventReturner false 一个事件 function eventReturner return f
  • router.navigate 使用查询参数 Angular 5

    我在使用查询参数路由到路由时遇到问题我有一个像这样的函数 goToLink link this router navigate link split 0 queryParams this sortParams link 和这个功能 sort
  • 如何在javascript中解析 yyyy-MM-dd HH:mm:ss.SSS 格式的日期?

    const time 2016 11 16 00 00 00 000 const date new Date time console info date 似乎 safari 无法解析 yyyy MM dd HH mm ss SSS 格式日
  • JavaScript 比较中应使用哪个等于运算符(== 与 ===)?

    这个问题的答案是社区努力 help privileges edit community wiki 编辑现有答案以改进这篇文章 目前不接受新的答案或互动 我在用着JSLint http en wikipedia org wiki JSLint
  • 在64位环境中加载32位进程

    我有以下几个问题 CHM 是 编译的 HTML 文件 我的 CHM 文件有一个启动 32 位应用程序的链接 CHM 文件是用 Javascript 编码的 这在 32 位操作系统环境中运行良好 但这在 64 位操作系统环境中不起作用 原因是

随机推荐

  • 以编程方式设置 Segue 标识符

    假设我有一个带有文本字段和按钮的 ViewController 我想使用展开转场 以便在单击按钮后我可以将文本字段的信息获取到我的其他视图控制器 我想使用PrepareForSegue方法 这样我就可以在 展开 之前将文本字段中的文本保存在
  • 无法使用 FluentEmail 发送电子邮件中的嵌入图像

    我在用着流利的电子邮件 https github com lukencode FluentEmail在 ASP NET core 2 0 类库中 它将发送电子邮件通知 下面是我到目前为止尝试过的示例代码 using FluentEmail
  • 使用毕加索强制重新下载图像

    我正在创建一个应用程序 它将从特定的 url 下载图像并将其显示在 ImageView 上 服务器会随着时间的推移更改此图像 但 url 保持不变 所以我想实现这样的逻辑 当应用程序旋转或重新打开时 从应用程序缓存加载图像 当用户点击下载按
  • 未捕获错误:断言失败:尝试使用已在使用的 id 注册视图:名称

    我随机开始收到此错误Uncaught Error Assertion Failed Attempted to register a view with an id already in use name在我的应用程序上使用 ember cl
  • 如何在多行文本框中不断滚动到文本末尾? [复制]

    这个问题在这里已经有答案了 我正在使用计时器用文本更新我的文本框 每次计时器滴答作响时 我都会被重定向到多行文本框中键入的文本的开头 这个怎么做 我想说 当您刷新时 您可以将选择光标移动到末尾 然后使用 ScrollToCaret 滚动文本
  • Redis中的数据目录在哪里?

    将一些数据写入 Redis 服务器后 我可以从客户端读取数据 但是 如何找到文件系统上的数据目录呢 最快的方法 使用redis cli redis cli config get dir 如果您配置了身份验证 则需要在使用中传递该身份验证 a
  • Parsley 2.x 和 Bootstrap 3 错误消息范围的错误放置

    我正在尝试将欧芹验证添加到 Bootstrap 3 btn group 中包含的一组单选按钮 问题是欧芹注入的错误包装器 在我的例子中设置为跨度 出现在两个选项之间 包含在标签内 而不是出现在 btn group div 之外 下面的示例对
  • 不安全的 JavaScript 尝试访问带有 URL 的框架:域、协议和端口必须匹配。

    我试图通过调用来设置应用程序的高度 FB init appId fbAppId status true cookie true xfbml true oauth true channelURL webUrl channel html FB
  • 如何配置 WCF 以支持故障契约,其中主机和客户端都在使用 net.pipe 的同一进程中?

    我正在尝试使用 net pipe 绑定为我的服务与客户端交互创建一个进程内单元测试 与良好的 WCF 服务一样 它在服务操作上使用FaultContractAttribute 来公开可能的错误 包装异常 到元数据 我想通过 XML 配置客户
  • time() 根据服务器返回不同的时间戳

    我现在搜索了好几个小时 似乎以前没有人遇到过这个问题 我运行一个脚本 将当前时间戳写入两台服务器上的数据库中 两者都有相同的操作系统 软件 和相同的时区 现在我发现 某些时间戳和当前时间 之间的差异是负数 是的 计算是正确的 time ol
  • WPF 的打印对话框和打印预览对话框

    是否有像 Google Chrome 或 Word 那样的 WPF 打印对话框与 WPF 中的打印预览对话框相结合 此时我使用 Windows 窗体中的打印预览对话框 我也尝试过使用它的 WPF 版本 但是WPF没有PrintPreview
  • 访问Android上的本机串口

    我想让 Android 应用程序 服务访问本机串行端口 UART RS 232 当我说本机时 我指的是真正的 UART 而不是 USB 转串行加密狗 我可以从终端 连接到 4 个本机串行端口之一 看到它们 它表明内核已经处理了低级的事情 l
  • 尝试添加引用时,为什么我会看到“无法发出程序集:引用的程序集...没有强名称”?

    我想在我的 WPF 项目中包含一个系统托盘图标 并找到了此资源 http www hardcodet net projects wpf notifyicon http www hardcodet net projects wpf notif
  • 在 Mac OS X 中的 apache 中为 CORS 启用 mod_headers

    我正在尝试设置我的网站以允许 CORS 进行跨域脚本编写 但这似乎需要mod header在我的 htaccess 文件中启用 我没有太多处理 apache 的经验 我尝试谷歌installing mod header in apache
  • 为什么使用 PHP Zend_Pdf 库在 PDF 上居中文本的代码不起作用?

    我正在尝试在服务器上动态创建 PDF 文档并使用 Zend Pdf 库将它们发送到客户端 PDF 上的所有文本都需要与页面居中对齐 页面为信纸大小 横向 使用我在不同网站上多次找到的函数时 我遇到了一个问题 中心对齐不正确 所有文本都显示在
  • 如何增加mfc中组合框控件的高度?

    我想增加组合框控件的高度 增加宽度正在发生 但是当我尝试增加组合框高度时 它并没有增加 我很清楚我想增加控件的垂直高度 通常组合框控件我创建如下 如上图所示 红色边框的控件是我想要增加高度的组合框控件 如果您可以看一下下面的 EDIT 控件
  • Python - 从纯文本邮件中提取正文

    我只想提取消息正文并返回它 我可以过滤字段并显示片段 但不能显示正文 def GetMimeMessage service user id msg id try message service users messages get user
  • 如何将 adbannerview 添加到 UISplitviewController

    我使用 UISplitViewController 制作了一个 ipad 应用程序 它可以在两个方向上运行 现在我想向该应用程序添加横幅 我该怎么做呢 在界面生成器中 我只能将肖像横幅添加到详细视图 这或多或少可以工作 但是当我转动 iPa
  • phpmyadmin 打开 MySQL 表列表非常慢

    我可以登录 phpmyadmin 并很快查看数据库 一旦我单击其中一个并尝试查看表格列表 速度非常慢 我有什么遗漏的吗 我从 Ubuntu 10 04 更新到 Ubuntu 12 04 之前没有出现过这种情况 打开 config inc p
  • mxGraph 可以将图表导出为 PDF 吗?

    我正在开发一个使用 mxGraph 的项目 其中需要我导出 PDF 格式的高分辨率输出以获取服务流程图 我尝试使用 Java Swing 客户端 JGraphX 重新创建图形并将其导出为 PDF 但结果与浏览器显示的结果并不接近 客户端上的