如何将html代码转换为c＃web应用程序中的图像 [英] How can I convert html code to image in c# web applications
本文介绍了如何将html代码转换为c＃web应用程序中的图像的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
亲爱的朋友们，
如何在c＃web应用程序中将我的html代码转换为图像（bmp或jpg）。
这里我使用html渲染将我的网格视图转换为html代码。
示例代码：
Dear Friends,
How can i convert my html code to image(bmp or jpg) in c# web applications.
here i am converting my grid view as html code using html render.
sample code:
DataTable dt = new DataTable("RunnerUp");
DataColumn dc1 = new DataColumn("Name", typeof(string));
DataColumn dc2 = new DataColumn("Points", typeof(int));
dt.Columns.Add(dc1);
dt.Columns.Add(dc2);
DataRow dr1 = dt.NewRow();
dr1[0] = "Vulpes";
dr1[1] = 235;
DataRow dr2 = dt.NewRow();
dr2[0] = "SP Nayak";
dr2[1] = 135;
DataRow dr3 = dt.NewRow();
dr3[0] = "Krishna";
dr3[1] = 40;
dt.Rows.Add(dr1);
dt.Rows.Add(dr2);
dt.Rows.Add(dr3);
GridView1.DataSource = dt;
GridView1.DataBind();
StringWriter stringWrite = new System.IO.StringWriter();
HtmlTextWriter htmlWrite = new HtmlTextWriter(stringWrite);
string content;
GridView1.RenderControl(htmlWrite);
content = stringWrite.ToString();
Bitmap m_Bitmap = new Bitmap(800, 400);
PointF point = new PointF(0, 0);
SizeF maxSize = new System.Drawing.SizeF(800, 800);
CssData css = null;
HtmlRender.Render(Graphics.FromImage(m_Bitmap), "<html><head></head><body>" + content + "</body></html>", point, maxSize, css);
m_Bitmap.Save(@"D:\Thumbnail1.bmp");
这里我没有得到网格视图标题的颜色，样式和宽度
请给我解决方案。
here i am not getting colors,styles and width of the grid view headers
Kindly Provide me the solution.
推荐答案
看看
http://html2canvas.hertzen.com/examples.html [ ^ ]
将html转换为画布，然后使用
var image = canvas将画布转换为base 64图像.toDataURL（image / png）。replace（image / png，image / octet-stream）;
take a look at
http://html2canvas.hertzen.com/examples.html[^]
this convert html into canvas and then convert canvas to base 64 image using
var image = canvas.toDataURL("image/png").replace("image/png", "image/octet-stream");
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="gridtoImage.aspx.cs" Inherits="examples_gridtoImage" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
<style type="text/css">
.gridview
{
border:1px solid black;
width:100%;
}
.gridview tr th
{
background:#1b9f7a;
color:#fff;
height:25px;
font-weight:bold;
}
.gridview tr,
.gridview tr td,
.gridview tr th
{
padding:2px;
}
.gridview tr:nth-child(even)
{
background:#CCC;
color:#333;
}
.gridview tr:nth-child(odd)
{
background:#FFF;
color:#333;
}
.gridview tr:nth-child(even):hover
{
background:#999;
color:#333;
}
.gridview tr:nth-child(odd):hover
{
background:#333;
color:#fff;
}
</style>
<script type="text/javascript" src="../build/html2canvas.js"></script>
<script type="text/javascript">
function CONVERT() {
html2canvas(document.getElementById('gv'), {
onrendered: function (canvas) {
// document.body.appendChild(canvas);
var image = canvas.toDataURL("image/png").replace("image/png", "image/octet-stream");
im.src = image;
}
});
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="gv">
<asp:GridView ID="GridView1" runat="server" CssClass="gridview">
</asp:GridView>
</div>
<br />
<input type="button" value="save as image" onclick="CONVERT()"/>
<img id="im" />
</form>
</body>
</html>
// aspx页
//aspx page
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="convertHTMLTOImage.aspx.cs" Inherits="convertHTMLTOImage" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" >
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:TextBox ID="txtWebsiteAddress" runat="server" Text="www.google.com" />
<asp:Button ID="btnCreateThumbnailImage" runat="server" Text="Create Thumbnail Image" OnClick="CreateThumbnailImage" /></td>
<asp:TextBox ID="txtWidth" runat="server" Text="200" />
<asp:TextBox ID="txtHeight" runat="server" Text="200" />
<asp:Image ID="imgThumbnailImage" runat="server" Visible="false" />
</div>
</form>
</body>
</html>
//代码落后
//code behind
using System;
using System.Collections.Generic;
using System.Linq;
using System.Drawing;
using System.Threading;
using System.Windows.Forms;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class convertHTMLTOImage : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void CreateThumbnailImage(object sender, EventArgs e)
{
string url = string.Format("http://{0}", txtWebsiteAddress.Text);
int width = Int32.Parse(txtWidth.Text);
int height = Int32.Parse(txtHeight.Text);
Thumbnail thumbnail = new Thumbnail(url, 800, 600, width, height);
Bitmap image = thumbnail.GenerateThumbnail();
image.Save(Server.MapPath("~") + "/Thumbnail.bmp");
imgThumbnailImage.ImageUrl = "~/Thumbnail.bmp";
imgThumbnailImage.Visible = true;
}
}
public class Thumbnail
{
public string Url { get; set; }
public Bitmap ThumbnailImage { get; set; }
public int Width { get; set; }
public int Height { get; set; }
public int BrowserWidth { get; set; }
public int BrowserHeight { get; set; }
public Thumbnail(string Url, int BrowserWidth, int BrowserHeight, int ThumbnailWidth, int ThumbnailHeight)
{
this.Url = Url;
this.BrowserWidth = BrowserWidth;
this.BrowserHeight = BrowserHeight;
this.Height = ThumbnailHeight;
this.Width = ThumbnailWidth;
}
public Bitmap GenerateThumbnail()
{
Thread thread = new Thread(new ThreadStart(GenerateThumbnailInteral));
thread.SetApartmentState(ApartmentState.STA);
thread.Start();
thread.Join();
return ThumbnailImage;
}
private void GenerateThumbnailInteral()
{
WebBrowser webBrowser = new WebBrowser();
webBrowser.ScrollBarsEnabled = false;
webBrowser.Navigate(this.Url);
webBrowser.DocumentCompleted += new WebBrowserDocumentCompletedEventHandler(WebBrowser_DocumentCompleted);
while (webBrowser.ReadyState != WebBrowserReadyState.Complete) Application.DoEvents();
webBrowser.Dispose();
}
private void WebBrowser_DocumentCompleted(object sender, WebBrowserDocumentCompletedEventArgs e)
{
WebBrowser webBrowser = (WebBrowser)sender;
webBrowser.ClientSize = new Size(this.BrowserWidth, this.BrowserHeight);
webBrowser.ScrollBarsEnabled = false;
this.ThumbnailImage = new Bitmap(webBrowser.Bounds.Width, webBrowser.Bounds.Height);
webBrowser.BringToFront();
webBrowser.DrawToBitmap(ThumbnailImage, webBrowser.Bounds);
this.ThumbnailImage = (Bitmap)ThumbnailImage.GetThumbnailImage(Width, Height, null, IntPtr.Zero);
}
}
这篇关于如何将html代码转换为c＃web应用程序中的图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
