如何使用CSS将SVG导入到Illustrator中而不出错？

Question

我为客户创建了20个充满图表的网页。他们希望将它们打印为出版物的一部分，因此我需要将SVG转换为EPS。

我已经将一个大型d3生成的SVG导入到Illustrator中。 CSS是内联的，所以大部分格式都已经过了（感谢这个答案：Can I turn SVG and external CSS into EPS?）。但是有两个问题。一个是四个x轴中的三个被粗黑线代替。另一个是完全缺少一些数据（右下图中的三行）。谁有任何关于什么是错的线索？

我已经查看了CSS，希望找到一些有利于某个特定轴或刻度但却看不到任何东西的东西。我无法共享SVG或页面，因为它是由客户端数据驱动的，这是保密的。

感谢艾玛的任何帮助

原SVG：

新插画家EPS：

Answer 1

如果其他人有同样的问题，我想我会发布我是如何解决这个问题的。问题是与CSS有关。 Illustrator以不同的方式呈现CSS，并对我的文本编辑器应用稍微不同的规则。特别是：

1. 包含下划线的类名称将被忽略;
2. 使用vw的font-size被忽略;
3. 两个相反的CSS规则适用的地方，似乎是第一个规则（没有正确测试）
4. CDATA声明必须在svg标记内
5. 有时，元素的路径必须比浏览器要求的更清晰地拼写出来

Answer 2

派对有点晚了，但我也注意到了Illustrator这样的文物。如果你在任何其他浏览器中打开SVG它工作正常。我的解决方案是使用InkScape，然后重新保存SVG文件。在此Illustrator处理好SVG之后。

Answer 3

这不完全是你的问题的答案，但如果你只是寻找一个足够高的分辨率打印图像，并不一定关心它是矢量与光栅图形，你总是可以使用高分辨率屏幕（如果你有一个4K / 5K屏幕，使用它，但iPad也可以做到这一点），放大，以便每个SVG图表占用尽可能多的屏幕，然后截取屏幕截图。如果你正在制作一张图表非常大的高质量打印件，它可能无法正常工作，但只要它是一个较大的文件的较小部分，你可能会得到一个足够大的图像，它是光栅图形赢得不会影响打印质量。

这种方法当然有其缺点，但它相对快速，简单，并且完成了工作。

编辑：看起来打印到PDF也将保留SVG图形，并且（至少在我的计算机上）两个图像之间似乎没有任何差异。一旦它是PDF格式，您就可以非常轻松地导入到Illustrator中，并从那里提取实际的SVG图形。