Html2canvas: 如何保存旋转图像？

尚不支持 CSS 转换。

那么我可以让图像在base64中旋转吗？

转换 css 不起作用。 有什么解决办法？？？

@arindamm唯一的快速解决方案是将“CSS”替换为“canvas”
在画布上获取图像或文本并进行旋转（这应该在库“html2canvas”之外完成，并且必须在调用函数之前完成）。

它不可能通过我的应用程序。 我打算制作一本在线故事书。 用户可以根据需要放置任意数量的图像和文本。 他们还可以缩放和旋转这些对象。 我正在为这些使用 DIV 标签。 如何使用 div 元素的数据创建画布？ 你能建议吗？

@arindamm正如我当时所说的那样保存图像，
您可以使用所有元素和“window.getComputedStyle”（或 jquery）来检测是否存在“旋转”。
如果以对象的样式“旋转”，则取“旋转”的值和对象内部的文本（或图像）并模拟“画布”上的效果。

 var canvas = document.getElementById('myCanvas');
 var context = canvas.getContext('2d');
 var rectWidth = 150;
 var rectHeight = 75;
 // 将上下文转换为画布中心
 context.translate(canvas.width / 2, canvas.height / 2);
 //顺时针旋转45度
 context.rotate(Math.PI / 4);
 context.fillStyle = '蓝色';
 context.fillRect(rectWidth / -2, rectHeight / -2, rectWidth, rectHeight);

链接：
https://developer.mozilla.org/en-US/docs/DOM/window.getComputedStyle
http://api.jquery.com/css/ （用 Jquery 获取 css）
http://www.html5canvastutorials.com/advanced/html5-canvas-transform-rotate-tutorial/ （用canvas+javascript旋转）

笔记：
没有现成的解决方案，但也许这些链接和代码可以为您的案例创建替代方案。
另一个想法是为每个完成工作的浏览器创建一个插件：

铬合金：
chrome.tabs.captureVisibleTab(integer windowId, object options, function callback)
链接：http: //developer.chrome.com/extensions/tabs.html

火狐： void drawWindow( in nsIDOMWindow window, in float x, in float y, in float w, in float h, in DOMString bgColor, in unsigned long flags [optional]);
链接： https ://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D?redirectlocale=en-US&redirectslug=DOM%2FCanvasRenderingContext2D#drawWindow()

希望有帮助。

关闭这个，因为在同一主题上还有多个其他问题。

也许有趣的是，当您将图像嵌入为 blob 时，旋转实际上是有效的......

更奇怪的是：它也可以在没有 blob 的情况下工作。 我几周前收到的文件显示它是 0.4.1。 在自己构建或通过凉亭安装时，它不起作用。 不幸的是我不记得我把它带到哪里了，因为我只是在玩......

当我使用 0.4.1 检查复选框时，内容 div 正在下降
谁能帮帮我吗。

你可以做一个解决方法，这里告诉你：
http://www.jjoe64.com/2015/10/html2canvas-and-css-transform-rotate.html

感谢链接@jjoe64 ，但对 html2canvas 没有意义。

html2canvas 是一个用于在画布中渲染（重绘）DOM 元素（或整页）的库，并且没有渲染画布标签。

您的解决方案仅适用于具有旋转的一个元素。

是的，这不是一个完美的解决方案，但如果您必须渲染旋转的文本或图像，它是一个解决问题的方法。 对于这个用例，它在我们使用它的项目中完美运行。

我如何使用 CSS 转换保存 div：透视？