同时打印HTML和SVG_Html_Internet Explorer_Svg_Printing

同时打印HTML和SVG

html internet-explorer svg printing

同时打印HTML和SVG,html,internet-explorer,svg,printing,Html,Internet Explorer,Svg,Printing,我正在尝试做一些“应该”相当简单的事情。我的程序（Java，使用SWT）有一个按钮，单击该按钮时，会打开一个带有浏览器组件的对话框。这个组件使用一些专门的输入访问我们的一个web服务，返回的html包含一个内联SVG图像和一些基本html（本质上是一个表）。下面是一些示例（为了便于阅读而截断）表{边框折叠：折叠；宽度：100%；} 表，td，th{边框：1px纯黑色；} svg{top:0；left:0；width:612px；height:450px；display:block；margi

我正在尝试做一些“应该”相当简单的事情。我的程序（Java，使用SWT）有一个按钮，单击该按钮时，会打开一个带有浏览器组件的对话框。这个组件使用一些专门的输入访问我们的一个web服务，返回的html包含一个内联SVG图像和一些基本html（本质上是一个表）。下面是一些示例（为了便于阅读而截断）


表{边框折叠：折叠；宽度：100%；}
表，td，th{边框：1px纯黑色；}
svg{top:0；left:0；width:612px；height:450px；display:block；margin:auto；}
样品标题
COL1 COL2COL3COL4
1234

注意：SVG的CSS行就在这里，因为我正在研究如何自动调整网页中的视觉显示大小。在我的调试/测试过程中，已以各种形式多次添加/修改/删除了此项。

注2:SVG视图框大小来自我使用的初始SVG文件。这些来自我的流程之外。

这对于在我的对话框中显示效果非常好，但我遇到的问题是，我希望允许用户使用对话框底部的“打印”按钮打印浏览器内容（因此，他们应该得到顶部的图像，理想情况下可以缩放以填充页面宽度，同时保留纵横比，下面是补充信息表。）如果我从

window.print（）；

的SWT调用Javascript，它将打印，但有两个特点

首先，如果我在对SVG进行修改后离开CSS行，它有时会在页面上注销。我很确定这与我对SVG CSS样式做了一些愚蠢的事情有关，我似乎无法理解

第二个问题是，它经常会覆盖表元素的顶部，即使我删除了调整图像比例/大小的CSS SVG行，这种情况也会发生

此外，如果我在IE中单击鼠标右键并选择“打印预览”，至少在“不覆盖表格顶部”的情况下看起来不错，但当它实际打印时，生成的纸张与预览显示的内容不匹配。如果我在正常IE窗口中从程序外部尝试此操作，则此行为是一致的

HTML是根据对Web服务的请求动态生成的。但如果类似的HTML被输入FireFox或Chrome，则不会出现任何错误（至少在我的裸体测试中是这样）。我们的应用程序将始终在Windows PC上运行，SWT使用IE（我现在使用的是版本11）在幕后，这就是为什么我认为我遇到了这个问题。我不是一个Web开发人员或CSS专家，我知道的足以让自己陷入麻烦，但我不确定目前如何解决这个问题

任何指导或其他使用IE处理HTML/SVG打印的人都将不胜感激。谢谢

<!DOCTYPE html>
<head>
<style> 
table {    border-collapse: collapse; width: 100%;} 
table, td, th {    border: 1px solid black;} 
svg { top:0; left:0; width:612px; height:450px; display:block; margin:auto;}
</style>
</head>
<body><h1><b>Sample Heading</b></h1>

<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" 
      viewBox="0 0 244.8 180" enable-background="new 0 0 244.8 180" xml:space="preserve" preserveAspectRatio="xMinYMin meet">

<!-- A whole lot of SVG commands here. -->

</svg>
<table border="1"><tr><th>Col1</th><th>Col2</th><th>Col3</th><th>Col4</th></tr>
<tr bgcolor="EDFEED"><td align="center">1</td><td>2</td><td>3</td><td>4</td></tr>
</table>
</body>
</html>