将HTML Div内容转换为图像

时间:2022-01-18 08:57:18

I am trying to make an image editor kind of page. Person can add text and styles to the background image. Everything i have done through HTML, Jquery and css, but struck up with export it to an image. I want to convert the particular div into image.

我想做一个图像编辑器。可以在背景图像中添加文本和样式。我通过HTML、Jquery和css所做的每一件事,都是为了将它导出到图像中。我想把特定的div转换成图像。

Note: I already know HTML to image conversion is possible through SVG and HTML5 Canvas. I cannot do those things because of browser compatibility.

注意:我已经知道通过SVG和HTML5 Canvas可以实现HTML到图像的转换。由于浏览器的兼容性,我不能做这些事情。

If any PHP classes or jquery plugin is available please help me.

如果有任何PHP类或jquery插件可用,请帮助我。

1 个解决方案

#1


0  

I think it is not possible without HTML5 features on the client side directly. May be I wrong?

我认为没有HTML5的客户端特性是不可能的。可能是我错了吗?

My solution is to send the entire div (with styles) to backend server, where capture a screenshot with PhantomJS or Qt Webkit. On the server side you shoold open the DIV user created as it displayed in user browser and then make screenshot of this DIV.

我的解决方案是将整个div(带有样式)发送到后端服务器,使用PhantomJS或Qt Webkit捕捉屏幕快照。在服务器端,您强制打开在用户浏览器中显示的DIV用户,然后对这个DIV进行屏幕截图。

#1


0  

I think it is not possible without HTML5 features on the client side directly. May be I wrong?

我认为没有HTML5的客户端特性是不可能的。可能是我错了吗?

My solution is to send the entire div (with styles) to backend server, where capture a screenshot with PhantomJS or Qt Webkit. On the server side you shoold open the DIV user created as it displayed in user browser and then make screenshot of this DIV.

我的解决方案是将整个div(带有样式)发送到后端服务器,使用PhantomJS或Qt Webkit捕捉屏幕快照。在服务器端,您强制打开在用户浏览器中显示的DIV用户,然后对这个DIV进行屏幕截图。