I'm generating a coupon based on dynamic input and a cropped image, and I'm displaying the coupon using ntml and css right now, the problem is, printing this has become an issue because of how backgrounds disappear when printing and other problems, so I think the best solution would be to be able to generate an image based on the html, or set up some kind of template that takes in strings and an image, and generates an image using the image fed in as a background and puts the coupon information on top.
Is there anything that does this already?
This is for an ASP.NET 3.5 C# website!
Thanks in advance.
edit: It'd be great if the output could be based on the HTML input, as the coupon is designed by manipulating the DOM using jQuery and dragging stuff around, it all works fine, it's just when it comes to the printing (to paper) it has z-indexing issues.
What you can do is create an aspx page that changes the response type to be in the format you want and then put the image into the stream. I created a barcode generator that does a similar thing. Excluding all the formalities of generating the image, you'll Page_Load will look something like this:
Bitmap FinalBitmap = new Bitmap();
MemoryStream msStream = new MemoryStream();
strInputParameter == Request.Params("MagicParm").ToString()
// Magic code goes here to generate your bitmap image.
FinalBitmap.Save(msStream, ImageFormat.Png);
Response.Clear();
Response.ContentType = "image/png";
msStream.WriteTo(Response.OutputStream);
if ((FinalBitmap != null)) FinalBitmap.Dispose();
and that's it! Then all you have to do in your image is set the URL to be something like RenderImage.aspx?MagicParm=WooHoo or whatever you need. That way you can have it render whatever you want to specify.
You can render html to a bitmap using the WebBrowser control in either a winforms or console application.
An example of this can be found here: http://www.wincustomize.com/articles.aspx?aid=136426&c=1
The above example can be modified to run in ASP.Net by creating a new STAThread and performing an Application.Run on it to start a new message loop.
PHP/Ruby Alternative
If you have accessed this question and are actually looking for soething that will work without Windows, you can try the KHTML library: http://wiki.goatpr0n.de/projects/khtmld
The website has a ridiculous name I admit, but I can assure you it is genuine. Other related pages are: the sourceforge page http://khtml2png.sourceforge.net/
Try PDFSharp...it's not exactly a "take this HTML and make a PDF" but with a small amout of fiddling you can easily make a PDF out of the info you are using to make the HTML.
MARKUP ONLY ALTERNATE SOLUTION
Use SVG and XSLT to transform the html data into an image that can be rendered/saved/etc.
I'll admit that at first it was tedious getting this to work because of all of the coordinates, but well worth the effort once it is running.
There is a very powerful image creation library called GD which I often use with PHP.
I am led to believe there is a wrapper for this library that ASP programmers can use. Try this
Unless the "other problems" are pretty severe, couldn't you just instruct your users to turn on Background Images when printing?
In any case, I'd default to serving a PDF rather than an image, doubly so since it is intended for print.
Just set up your css properly, so that you have a css file targeted at the print medium. It is pretty easy to guarantee that the coupon will always be legible, without worrying about whether they have bg images on or not. Needlesly moving to an image doesn't make any sense, unless there is some reason you don't want it to be machine readable.
I haven't tried to myself, but you should be able to render HTML into an image by using the WebBrowser control and the DrawToBitmap() method inherited from the base Control class.
UPDATE: I tried this myself and there are some caveats. The WebBrowser control doesn't seem to render the web page until the control is show, so the WebBrowser needs to be in a Form and the Form must be shown for the HTML to be rendered and the DocumentCompleted event to be raised.
Related
In my C# code I am rendering a JPEG image of a HTML page using a string variable (which holds my html code). There's a table in that html code whose borders are not being rendered in JPEG image.
I am using the following code to generate image :-
string sHtml = m_Html; //m_Html contains the html code
Image img = HtmlRender.RenderToImage(sHtml);
After thorough searching, I understood that HtmlRenderer renders the string which we pass (as a parameter) into a HTML page and then takes a snapshot. Now, the rendering engine which HtmlRenderer uses is not very sophisticated, it does not support latest/complex CSS queries.So if you are facing this issue, use simple HTML/CSS.
If still you are not able to solve the issue, use a different library 'NReco'. NReco is open source if you just use it, licensed if you want to modify it. NReco is better than HTML Renderer.
I am developing a C# web project. I run it on the local web server.
I draw. I show image as follows:
bitmap.Save(Server.MapPath("diagram.jpg"), ImageFormat.Jpeg);
Image1.ImageUrl = ResolveUrl("diagram.jpg");
I don't see new image. Only old one, which I had after changing image name
(Say, I change diagram.jpg to diagram2.jpg).
Browser is Firefox.
The design page in C# is simple. Just Image and few TextBoxes on the page.
No UpdatePanel and such.
Something with caching... But how to fight with that...
But how to fight with that.
Always use a separate path / name. Pug a GUID somewhere. Simple like that. Different file can not be cached.
I'm not sure what ResolveUrl does, but try adding a querystring to the image url so that the page always gets a "fresh" file. Something like this:
Image1.ImageUrl = ResolveUrl(string.Format("diagram.jpg?v={0}", Guid.NewGuid()));
You can alternative write the image file as
diagram.jpg?ver=2
to keep the same image file, but force the browser to update it.
If Image has Same name and URL browser picks the image from the cache and displays the same for faster loading of the pages.
Even if you change the image server side the same cached image is displayed until you clear the cache of the browser. You can use query string to change image url like below.
Image1.ImageUrl = ResolveUrl("diagram.jpg?" + DateTime.Now.Ticks.ToString());
I've been reading through a few asp.net articles, and attempting some code, but I think I may be confused. Can you or can you not draw lines on the screen with code on a ASP.NET webform using c#?
If so, can anyone direct me to some examples?
You cannot directly draw on a webform. You may draw on the image and then embed it on your webform (like any other image).
You can make a canvas and then you can draw whatever you want to draw on it.But direct drawing is impossible.
If you are fine with HTML5 you can try lineto Javascript method:
<script>
context.lineTo(100, 200);
</script>
Please refer # following link for more details:
http://www.html5canvastutorials.com/tutorials/html5-canvas-lines/
Not sure what you mean by "draw a line" but if you are using a web browser you need some kind of HTML object to display this "line". If all you need is a horizontal line you can just add a HR html tag and use CSS toy stylize it. You can also include this line in an image or HTML5 Canvas.
Because there is not screen for your server side code. Your code generates HTML, JavaScript etc. and then browser uses that content to render it on the client screen. So your options are to generate image (draw all that you need) in server side code and send it to the browser, or you can use JavaScript and send browser instructions how to draw lines.
You could probably create a new image using the System.Drawing namespace classes and then do something like dynamically load it into an <img /> tag...but depending on what you're trying to accomplish it may be far easier to either use a JavaScript library of some sort or to use some sort of very simple line image and tweak the length/height using css.
More detail would be needed to understand what you're trying to do. As others have pointed out though, there's no direct way for your C# code to interact with the page. You'd have to have something on the page like an img tag and then set it's source to a C# file like a handler (.ashx). In that handler you could generate the image and then set the response content type as image/jpg and write the raw bytes to the response stream...
Again though, that seems like overkill for something that could be accomplished with CSS or javascript.
Hi there
I am working with visual web developer and would a) like to know how I could programatcally add a picture to the website, instead of going to Website and then add existing item. The idea I have is to upload the picture using the file upload control but then I want to have it added so that it can be accessed using a gridview.
b)I would also like to know how to size the picture using C# code obviously so that is displayed at the correct size.
best regards
arian
here is a full project with source code to manipulate images, including resize.
http://www.codeproject.com/KB/web-image/ASPImaging1.aspx
And a sample code only for resize
http://weblogs.asp.net/gunnarpeipman/archive/2009/04/02/resizing-images-without-loss-of-quality.aspx
You can use GetThumbnailImage to easily create a smaller verson of the uploaded image. The code looks something like (it's free typed without a compiler, so there may be some errors):
System.Drawing.Image pic = new System.Drawing.Bitmap(sourceFilename);
System.Drawing.Image thumb = pic.GetThumbnailImage(targetXSize,targetYSize,
new System.Drawing.Image.GetThumbnailImageAbort(this.GetThumbnailImageAbort),
IntPtr.Zero);
thumb.Save(thumbPathName);
I believe the Image implements IDisposable, so you need to remember to Dispose of them when you're done.
The abort parameter can be a function that simply does this (can't remember off the top of my head when it gets called):
bool GetThumbnailImageAbort() {
return false;
}
I need to create a data index of HTML pages provided to a service by essentially grabbing all text on them and putting them in a string to go into a storage system.
If this were GUI based, I would simply Ctrl+A on the HTML page, copy it, then go to Notepad and Ctrl+V. Simples. If I can do it via good old point n' click, then surely there must be a way to do it programmatically, but I'm struggling to find anything useful.
The HTML docs in question are being loaded for rendering currently using the System.Windows.Controls.WebBrowser class, so I wonder if its somehow possible to grab the data from there?
I'm going to keep hunting, but any pointers would be very appreciated.
Note: We don't want the HTML source code, and would also really rather not have to parse all the source code to get the text unless we absolutely have to.
If I understand your problem correctly, you will have to do a bit of work to get the data.
WebBrowser browser=new WebBrowser(); // This is what you have
HtmlDocument doc = browser.Document; // This gives you the browser contents
String content =
(((mshtml.HTMLDocumentClass)(doc.DomDocument)).documentElement).innerText;
That last line is the browser's view of the rendered content.
This looks like it might be quite helpful.