How To Write Text Over Images Using ASPJpeg

Written by Nick Dunn published 26th Feb 2006 | 2 replies in the forums

The latest version of ASPJpeg allows us to write text over the top of images. Excellent for buttons or copyright notices.

How To Write Text Over Images Using ASPJpeg

With ASPJpeg you can easily manipulate images on the server. To call an image, we can do so by linking to an ASP file, passing the image path to the file.

<img src="changeImage.asp?path=d:\Webs\mydomain.co.uk\wwwroot\car.jpg">

The page "changeImage.asp" opens the image and sends it back to the browser. To write text over images, you can use the following method. This is the contents of changeImage.asp.

<%
Dim strText
strText = "© MySite.com"
'Set the text you want written over the image
Dim Jpeg
'Declare you're going to be using Jpeg
Set Jpeg = Server.CreateObject("Persits.Jpeg")
'Open ASPJpeg object
Jpeg.Open Request("path")
'Opens image as a new image in the server memory ready to edit
jpeg.Width = jpeg.OriginalWidth
'Sets width to actual image width
jpeg.Height = jpeg.OriginalHeight
'Sets width to actual image width
TextVertical = Jpeg.Height - 21
'A bit of trickery to get text to be printed
'21 pixels from the bottom of the new image
'Set first line of text as black, Arial, bold and size 14
Jpeg.Canvas.Font.Color = &H000000
Jpeg.Canvas.Font.Family = "Arial"
Jpeg.Canvas.Font.Bold = True
Jpeg.Canvas.Font.Size = 14
Jpeg.Canvas.Print 11, TextVertical + 1, strText
'Write text 11px from left edge
'Set second line of text as white, Arial, bold and size 14
Jpeg.Canvas.Font.Color = &HFFFFFF
Jpeg.Canvas.Font.Family = "Arial"
Jpeg.Canvas.Font.Bold = True
Jpeg.Canvas.Font.Size = 14
Jpeg.Canvas.Print 10, TextVertical, strText
'Write text 10px from left edge
Jpeg.SendBinary
'Send image to user's browser
Jpeg.Close
Set Jpeg = Nothing
'Be kind to the server and clear up!
%>

The only slightly tricky bit in the code above is the Jpeg.Canvas.Print which writes the text over your photo. It can contain 3 values, as in the example above - horizonal space, vertical space, and content. You'll notice in the example that the vertical (third value) isn't a number. Instead the variable "TextVertical" is asigned the value of the image height, minus 21. This is just for nice presentation, so the text is printed 21 pixels from the bottom of the image (the shadow being 21 and the normal text 20).