dynamic PDF v/s HTML to PDF

我目前正在为医疗保健行业开发多个仪表板，并且其中一个常见要求是按原样从屏幕生成PDF。我们在这些仪表板上没有任何常见的CRUD操作。它们通常包括很多图表（使用高图），一些表格数据，手风琴等等。一切都是作为几个选择语句的一部分呈现的，这些语句将在页面加载时触发，或者如果用户点击某个图表或任何HTML元素。dynamic PDF v/s HTML to PDF

我正在研究如何做到这一点，并有2个选项，其中最着名的选择是使用第三方库从HTML本身生成PDF，其中包括最少的写作约3 -4行代码。

另一种选择是编写代码来动态生成看起来像UI的PDF。这需要更多的努力，因为我们必须考虑品牌和样式，生成完全类似于dasboard UI的图表，创建表格数据，就像在仪表板的UI上一样。

所有仪表板的通用UI要求是支持所有主流浏览器 - 从9开始的IE，forefox，Chrome，Safari。还支持iPads，iPhone的最后3-4个版本和其他最常见的设备。

我们用于这些仪表板的技术是角度2.0，一些JQuery，HTML，CSS和asp.net web api以及某些情况下的asp.net MVC。

我需要知道以上两种方式的优点和缺点，为所有这些仪表板生成PDF。我搜索了这个发现很少。有人可以分享一些洞察力，并根据他们的经验提供一些意见吗？

来源

2016-10-05 user979189

根据您描述的内容，您至少需要将这两者混合使用。如果您可以使用HTML-to-PDF转换器，那会更好，因为这样可以节省大量的开发时间。但是由于UI具有手风琴等类似的东西，这意味着您需要确定如何在静态PDF中呈现动态信息。

所以我在过去使用的混合方法是用角来标记这样的HTML：

<my-accordion ng-if="!ExportingPDF"> ... accordion view for browser ...</my-accordion> 
<div ng-if="ExportingPDF"> ... expanded and slightly-modified view for PDF ... </div>

当上“导出PDF”按钮，用户点击，您可以创建一个功能那会执行$scope.ExportingPDF = true，然后抓取页面上所有可见的HTML（在短暂的$timeout延迟之后给予Angular时间来更新DOM）。

然后您的ExportPDF函数将POST HTML发送到服务器，其中基于服务器的HTML到PDF代码库将转换HTML，然后将其作为文件下载附件发送回浏览器。

示例代码：

$scope.ExportPDF = function() { 
    $scope.ExportingPDF = true; 
    $timeout(function() { 
     $ajax.post("/path/to/conversion-routine.abc", { data: $('html')[0].outerHTML } 
    }, 50); // short delay so Angular has time to update the DOM 
}

这可以让你利用的角度力量和您现有的标记，同时仍然需要进行调整，以静态的PDF文档中正确显示所有古灵精怪的小UI的事情处理。

来源

2016-10-05 21:17:11

dynamic PDF v/s HTML to PDF

回答

相关问题