css - 打印时捕获整个 d3 图

标签 css printing d3.js

我正在尝试为具有大量 d3 图形的应用程序编写 print.css 样式表。我已经尝试将宽度设置为 100%、不同的 pt 值等,但我就是无法在打印预览中显示整个图表。有关如何设置 svg/容器样式以便将整个内容打印在普通 8.5x11 上的任何提示?

非常感谢。下图:x 轴实际上是 2013 年,如您所见,打印时图形被截断

The x-axis actually goes to 2013, and the graph gets cut off when printing as you can see

最佳答案

编辑...

我最初的建议是:

svg#time-series-graph {
    transform: scale(0.5);
}

这不适用于浏览器。如果我理解正确的话,transform 属性实际上并不在 SVG 规范中,因为它可以使用 CSS 进行更改(尽管它似乎在 Firefox 中有效)。

一个丑陋的替代方案是渲染两个图表:一个只在屏幕上可见,一个较小的只在 print.css 中可见。必须有更好的方法来做到这一点!

关于css - 打印时捕获整个 d3 图,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23796157/

相关文章:

html - 将图标定位到圆圈中

css - 是否可以使用 CSS 过滤器仅模糊图像的特定部分?

java - Windows 7 点阵打印机中的 jasper 打印字体不清晰

javascript - 如何为 D3 子弹图内联数据

eclipse - 为什么即使我删除了@font-face 代码并从我的机器上卸载了字体,我的@font-face 字体仍能正常工作?

html - Facebook Like 按钮导致水平滚动条

c# - 在 WPF 中打印隐藏窗口

java - 如何使用eclipse在java中打印带下划线的字符串

javascript - 如何使我的文本保留变量编号而不是 javascript D3 中的引用?

javascript - 在 x 轴 d3.js 中显示特定数组