반응형
HTML 문자열을 이미지로 변환
HTML 마크업을 포함하는 문자열 변수가 있습니다.이 HTML 마크업은 기본적으로 전자 메일 내용을 나타냅니다.
이제 저는 HTML 마크업을 실제로 가지고 있는 이 문자열 내용으로 이미지를 만들고 싶습니다.HTML 파일에 이 내용을 써서 만들고 싶지 않습니다.이 문자열을 사용하여 이미지 파일을 만들고 싶습니다.
제가 가진 것은 다음과 같습니다.
string emailBody="<html><head></head><body><p>This is my text<p>...</body</html>"
이 정보에서 이미지를 생성하려면 어떻게 해야 합니까?emailBody문자열 내용?
당신의 답변에 모두 감사드립니다.저는 HtmlRenderer 외부 dll(라이브러리)을 사용하여 동일한 결과를 얻었고 아래 코드를 찾았습니다.
여기 이것의 코드가 있습니다.
public void ConvertHtmlToImage()
{
Bitmap m_Bitmap = new Bitmap(400, 600);
PointF point = new PointF(0, 0);
SizeF maxSize = new System.Drawing.SizeF(500, 500);
HtmlRenderer.HtmlRender.Render(Graphics.FromImage(m_Bitmap),
"<html><body><p>This is some html code</p>"
+ "<p>This is another html line</p></body>",
point, maxSize);
m_Bitmap.Save(@"C:\Test.png", ImageFormat.Png);
}
다음을 시도합니다.
using System;
using System.Drawing;
using System.Threading;
using System.Windows.Forms;
class Program
{
static void Main(string[] args)
{
var source = @"
<!DOCTYPE html>
<html>
<body>
<p>An image from W3Schools:</p>
<img
src=""http://www.w3schools.com/images/w3schools_green.jpg""
alt=""W3Schools.com""
width=""104""
height=""142"">
</body>
</html>";
StartBrowser(source);
Console.ReadLine();
}
private static void StartBrowser(string source)
{
var th = new Thread(() =>
{
var webBrowser = new WebBrowser();
webBrowser.ScrollBarsEnabled = false;
webBrowser.DocumentCompleted +=
webBrowser_DocumentCompleted;
webBrowser.DocumentText = source;
Application.Run();
});
th.SetApartmentState(ApartmentState.STA);
th.Start();
}
static void
webBrowser_DocumentCompleted(
object sender,
WebBrowserDocumentCompletedEventArgs e)
{
var webBrowser = (WebBrowser)sender;
using (Bitmap bitmap =
new Bitmap(
webBrowser.Width,
webBrowser.Height))
{
webBrowser
.DrawToBitmap(
bitmap,
new System.Drawing
.Rectangle(0, 0, bitmap.Width, bitmap.Height));
bitmap.Save(@"filename.jpg",
System.Drawing.Imaging.ImageFormat.Jpeg);
}
}
}
참고: 이 솔루션에 영감을 준 새로운 스레드의 웹 브라우저 제어 질문에 대한 훌륭한 답변에 대한 공로는 한스 패상에게 돌아가야 합니다.
그래서 저는 이것을 따라왔고, 저는 이런 것을 찾는 사람들을 위해 제 최신 솔루션을 게시하기로 했습니다.
(오픈 소스) Puppeteer Sharp (v3) 결과는 다음과 같습니다.
public class ImageRenderer : IDisposable
{
private BrowserFetcher _browserFetcher;
public ImageRenderer()
{
_browserFetcher = new BrowserFetcher();
}
public async Task<byte[]> RenderImageDataAsync(string html)
{
try
{
// Download chrome (headless) browser (first time takes a while).
await _browserFetcher.DownloadAsync();
// Launch the browser and set the given html.
await using var browser = await Puppeteer.LaunchAsync(new LaunchOptions { Headless = true });
await using var page = await browser.NewPageAsync();
await page.SetContentAsync(html);
// Select the element and take a screen-shot, or just use the page, for example: page.ScreenshotDataAsync()
var elementQuery = "#myElementId";
await page.WaitForSelectorAsync(elementQuery, new WaitForSelectorOptions { Timeout = 2000 }); // Wait for the selector to load.
var elementHandle = await page.QuerySelectorAsync(elementQuery); // Declare a variable with an ElementHandle.
var result = await elementHandle.ScreenshotDataAsync(
new ScreenshotOptions
{
Type = ScreenshotType.Png
// Quality = Not supported with PNG images!
}
);
await browser.CloseAsync();
return result;
}
catch (Exception ex)
{
// Log ex $"{nameof(RenderImageDataAsync)}: Unable to render image from {nameof(html)}={html}");
}
return null;
}
public void Dispose()
{
_browserFetcher = null;
}
}
- 찬성: 실제 브라우저를 사용합니다;
- 단점: 실제 브라우저를 사용합니다;
_browserFetcher.DownloadAsync();(폴더에) 다운로드합니다..local-chromium) 이를 위해 약 380MB의 파일이 있습니다.
<!--ForExport data in iamge -->
<script type="text/javascript">
function ConvertToImage(btnExport) {
html2canvas($("#dvTable")[0]).then(function (canvas) {
var base64 = canvas.toDataURL();
$("[id*=hfImageData]").val(base64);
__doPostBack(btnExport.name, "");
});
return false;
}
</script>
<!--ForExport data in iamge -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="../js/html2canvas.min.js"></script>
<table>
<tr>
<td valign="top">
<asp:Button ID="btnExport" Text="Download Back" runat="server" UseSubmitBehavior="false"
OnClick="ExportToImage" OnClientClick="return ConvertToImage(this)" />
<div id="dvTable" class="divsection2" style="width: 350px">
<asp:HiddenField ID="hfImageData" runat="server" />
<table width="100%">
<tr>
<td>
<br />
</td>
</tr>
<tr>
<td>
<asp:Label ID="Labelgg" runat="server" CssClass="labans4" Text=""></asp:Label>
</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
protected void ExportToImage(object sender, EventArgs e)
{
string base64 = Request.Form[hfImageData.UniqueID].Split(',')[1];
byte[] bytes = Convert.FromBase64String(base64);
Response.Clear();
Response.ContentType = "image/png";
Response.AddHeader("Content-Disposition", "attachment; filename=name.png");
Response.Buffer = true;
Response.Cache.SetCacheability(HttpCacheability.NoCache);
Response.BinaryWrite(bytes);
Response.End();
}
언급URL : https://stackoverflow.com/questions/17832304/convert-html-string-to-image
반응형
'programing' 카테고리의 다른 글
| T-SQL 조건부 순서 기준 (0) | 2023.08.25 |
|---|---|
| GDB 및 C를 위한 멀티스레드 디버깅 튜토리얼 (0) | 2023.08.25 |
| SIGSEGV/SIGABRT 및 친구를 위한 Oracle Pro*C/OCI 설치 핸들러 - 사용하지 않는 이유 및 방법 (0) | 2023.08.20 |
| 오라클에서 타임스탬프 정밀도를 높게 선택할 경우의 단점은 무엇입니까? (0) | 2023.08.20 |
| 마리아드브를 어떻게 삽입합니까? (0) | 2023.08.20 |