可视化html文件怎么修改支持PDF导出

这篇文章主要介绍“可视化html文件怎么修改支持PDF导出”，在日常操作中，相信很多人在可视化html文件怎么修改支持PDF导出问题上存在疑惑，小编查阅了各式资料，整理出简单好用的操作方法，希望对大家解答”可视化html文件怎么修改支持PDF导出”的疑惑有所帮助！接下来，请跟着小编一起来学习吧！

使用NotePad++等文本编辑器打开html文件，文件中要修改4处地方。

1.在原文件第十一行添加两行代码。如下图所示，将右边文件的两行代码复制，粘贴到左边文件第十，十一行之间。

代码如下：

  <script src="cyto/cytoscape-svg.js"></script>
  <script src="cyto/FileSaver.js"></script>

2.原文件删除第124-131行。注意第一处修改后行号会变，不要删错了。

3.原文件204行处添加一段代码，把右边文件第199-203行复制粘贴到右边文件。注意行号变化，不要粘错位置。

代码如下：

  var saveAsSvg = function(filename) {
    var svgContent = cy.svg({scale: 1, full: true, bg: '#ffffff'});
    var blob = new Blob([svgContent], {type:"image/svg+xml;charset=utf-8"});
    saveAs(blob, "ppi.svg");
   };

4.原文件225-227行删除，替换为右边文件224-225行内容。注意行号变化，不要粘错位置。

 代码如下：

<button type="button" class="btn btn-default" onclick="saveAsSvg()">Save as SVG</button>

修改完后保存文件。最后将压缩包（js.zip）中的cytoscape-svg.js 和 FileSaver.js俩文件复制粘贴到原文件目录下的cyto文件夹即可。

到此，关于“可视化html文件怎么修改支持PDF导出”的学习就结束了，希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习，快去试试吧！若想继续学习更多相关知识，请继续关注亿速云网站，小编会继续努力为大家带来更多实用的文章！