javascript - 试图将 html div 转换为图像。考虑到 transform3d

标签 javascript html css html2canvas

我已经看过 How do I convert my entire div data into image and save it into directory without using canvas?

我使用了 html2canvas 库,我能够得到一张图片,但这不是我想要的,因为我里面有一个 3dtransfomed div,而最终的图片没有保留那个属性。

使用 html2canvas 库的结果是这样的: enter image description here

我想得到的是这样的(蓝点无关紧要): enter image description here

我有一段 html 代码:<div id=background><div id=pig style=transform: matrix3d(1,2,4,2,34,4,5,3,54,3,4,4)><img src=whatever/></div></div>我想将其转换为图像。我尝试使用他们在我链接到顶部的帖子中提到的 html2canvas 库。但结果是我发布的第一张图片。我希望结果看起来像第二张图片。所以我认为是因为它没有考虑到 pig div上的transform3d。

最佳答案

我建议拍摄您获得的图像(看起来不错,但没有正确倾斜)并通过 CSS 转换运行它。

Information about CSS 3D Transforms

This demo of skewing a 3D prism with CSS你应该特别感兴趣

关于javascript - 试图将 html div 转换为图像。考虑到 transform3d,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37221683/

相关文章:

javascript - 将一组正方形分成 2 的幂的公式是什么? (Javascript)( Canvas )

javascript - 使用溢出时 div 内容向上滚动 : auto in IE 10

javascript - TD 不响应 Outlook

css - 如何调整 SVG 剪辑路径的大小?

javascript - contenteditable = true 在应用 javascript 时停止工作

asp.net-mvc - .ui-widget :active and . ui-widget :active? 之间有区别吗

javascript - 单击 <a> 时,如何使用 jquery 添加新的 <a> ?

Javascript if 语句忽略 jQuery $(this)

php - Html 表单传递不带点的输入复选框变量

javascript - vue.js - 响应数据错误未定义