473,326 Members | 2,113 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,326 software developers and data experts.

Binary images - thumbnails

Hi all

I have a SQL database where images are stored in a varBinary field. I can
display those images within a image control on a page by using the following:

ImageUrl='<%# Eval("PictureID", "~/ShowPicture.aspx?PictureID={0}") %>'

The image is generated from an aspx page called “showPicture.aspx” using the
following code behind:

Imports System.Data.SqlClient

Partial Class ShowPicture
Inherits System.Web.UI.Page

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs)
Handles Me.Load
Dim PictureID As Integer = Convert.ToInt32(Request.QueryString("PictureID"))

'Connect to the database and bring back the image contents & MIME type for
the specified picture
Using myConnection As New
SqlConnection(ConfigurationManager.ConnectionStrin gs("ImageGalleryConnectionString").ConnectionStrin g)

Const SQL As String = "SELECT [MIMEType], [ImageData] FROM [Pictures] WHERE
[PictureID] = @PictureID"
Dim myCommand As New SqlCommand(SQL, myConnection)
myCommand.Parameters.AddWithValue("@PictureID", PictureID)

myConnection.Open()

Dim myReader As SqlDataReader = myCommand.ExecuteReader
If myReader.Read Then
Response.ContentType = myReader("MIMEType").ToString()
Response.BinaryWrite(myReader("ImageData"))
End If
myReader.Close()
myConnection.Close()
End Using
End Sub
End Class

The problem I have is that the image control needs to be a thumbnail of the
original image. When I use the above technique the images are not
proprotionately resized to fit the image control width and height – rather
they are stretched to fit.
Can anyone give me some guidance on how once the binary data has been
retrieved it can be proportionatley resized to fit the image control?
Essentialy producing ‘thumbnails’ of the original.

Many thanks

Aug 4 '08 #1
4 1557
On Aug 4, 1:34*pm, James Page <JamesP...@discussions.microsoft.com>
wrote:
Hi all

I have a SQL database where images are stored in a varBinary field. I can
display those images within a image control on a page by using the following:

ImageUrl='<%# Eval("PictureID", "~/ShowPicture.aspx?PictureID={0}") %>'

The image is generated from an aspx page called showPicture.aspx using the
following code behind:

Imports System.Data.SqlClient

Partial Class ShowPicture
Inherits System.Web.UI.Page

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs)
Handles Me.Load
Dim PictureID As Integer = Convert.ToInt32(Request.QueryString("PictureID"))

'Connect to the database and bring back the image contents & MIME type for
the specified picture
Using myConnection As New
SqlConnection(ConfigurationManager.ConnectionStrin gs("ImageGalleryConnectio*nString").ConnectionStri ng)

Const SQL As String = "SELECT [MIMEType], [ImageData] FROM [Pictures] WHERE
[PictureID] = @PictureID"
Dim myCommand As New SqlCommand(SQL, myConnection)
myCommand.Parameters.AddWithValue("@PictureID", PictureID)

myConnection.Open()

Dim myReader As SqlDataReader = myCommand.ExecuteReader
If myReader.Read Then
Response.ContentType = myReader("MIMEType").ToString()
Response.BinaryWrite(myReader("ImageData"))
End If
myReader.Close()
myConnection.Close()
End Using
End Sub
End Class

The problem I have is that the image control needs to be a thumbnail of the
original image. When I use the above technique the images are not
proprotionately resized to fit the image control width and height rather
they are stretched to fit.
Can anyone give me some guidance on how once the binary data has been
retrieved it can be proportionatley resized to fit the image control?
Essentialy producing thumbnails of the original.

Many thanks
I am sure you will find many examples in google. Here's the one, which
could help you. Hope it works :-)
Response.ContentType = myReader("MIMEType").ToString()
Dim content As Byte() = CByte(myReader("ImageData"))

lnWidth = 100
lnHeight = 100

Dim s As New MemoryStream(content)
Dim image As New Bitmap(s)

Dim bmpOut As System.Drawing.Bitmap

Try
Dim loBMP As New Bitmap(s)
Dim loFormat As ImageFormat = loBMP.RawFormat
Dim lnRatio As Decimal
Dim lnNewWidth As Integer = 0
Dim lnNewHeight As Integer = 0

If loBMP.Width loBMP.Height Then
lnRatio = CDec(lnWidth) / loBMP.Width
lnNewWidth = lnWidth
Dim lnTemp As Decimal = loBMP.Height * lnRatio
lnNewHeight = CInt(lnTemp)
Else
lnRatio = CDec(lnHeight) / loBMP.Height
lnNewHeight = lnHeight
Dim lnTemp As Decimal = loBMP.Width * lnRatio
lnNewWidth = CInt(lnTemp)
End If

bmpOut = New Bitmap(lnNewWidth, lnNewHeight)
Dim g As Graphics = Graphics.FromImage(bmpOut)
g.InterpolationMode =
System.Drawing.Drawing2D.InterpolationMode.HighQua lityBicubic
g.FillRectangle(Brushes.White, 0, 0, lnNewWidth, lnNewHeight)
g.DrawImage(loBMP, 0, 0, lnNewWidth, lnNewHeight)

loBMP.Dispose()
Catch
Return
End Try

stream.Close()
stream.Dispose()

Try
bmp.Save(Response.OutputStream,
System.Drawing.Imaging.ImageFormat.Jpeg)
Catch
Finally
bmp.Dispose()
End Try
Aug 4 '08 #2
Thanks Alexey

But having problems:
Here is the revised code:

Imports System.Data.SqlClient
Imports System.IO
Imports System.Drawing
Imports System.Drawing.Imaging

Partial Class showPicture
Inherits System.Web.UI.Page

Protected Sub Page_Load(ByVal sender As Object, ByVal e As
System.EventArgs) Handles Me.Load
Dim ID As Integer = Convert.ToInt32(Request.QueryString("PictureID"))

'Connect to the database and bring back the image contents & MIME
type for the specified picture
Using myConnection As New
SqlConnection(ConfigurationManager.ConnectionStrin gs("picturesConnectionString").ConnectionString)

Const SQL As String = "SELECT [ID], [MIMEtype], [Image] FROM
[Pictures] WHERE [ID] = @PictureID"
Dim myCommand As New SqlCommand(SQL, myConnection)
myCommand.Parameters.AddWithValue("@PictureID", ID)

myConnection.Open()
Dim myReader As SqlDataReader = myCommand.ExecuteReader

If myReader.Read Then
Response.ContentType = myReader("MIMEtype").ToString()
'Response.BinaryWrite(myReader("Image"))
Dim content As Byte() = CByte(myReader("image"))
End If

Dim lnWidth As Integer = 100
Dim lnHeight As Integer = 100

Dim s As New MemoryStream(Content)
Dim image As New Bitmap(s)

Dim bmpOut As System.Drawing.Bitmap

Try
Dim loBMP As New Bitmap(s)
Dim loFormat As ImageFormat = loBMP.RawFormat
Dim lnRatio As Decimal
Dim lnNewWidth As Integer = 0
Dim lnNewHeight As Integer = 0

If loBMP.Width loBMP.Height Then
lnRatio = CDec(lnWidth) / loBMP.Width
lnNewWidth = lnWidth
Dim lnTemp As Decimal = loBMP.Height * lnRatio
lnNewHeight = CInt(lnTemp)
Else
lnRatio = CDec(lnHeight) / loBMP.Height
lnNewHeight = lnHeight
Dim lnTemp As Decimal = loBMP.Width * lnRatio
lnNewWidth = CInt(lnTemp)
End If

bmpOut = New Bitmap(lnNewWidth, lnNewHeight)
Dim g As Graphics = Graphics.FromImage(bmpOut)
g.InterpolationMode =
System.Drawing.Drawing2D.InterpolationMode.HighQua lityBicubic()
g.FillRectangle(Brushes.White, 0, 0, lnNewWidth, lnNewHeight)
g.DrawImage(loBMP, 0, 0, lnNewWidth, lnNewHeight)

loBMP.Dispose()
Catch
Return
End Try

stream.Close()
stream.Dispose()

Try
bmp.Save(Response.OutputStream,
System.Drawing.Imaging.ImageFormat.Jpeg)
Catch
Finally
bmp.Dispose()
End Try
End Using
End Sub
End Class
However line 25: Dim content As Byte() = CByte(myReader("image"))
shows an error ("Value of type byte cannot be converted to 1 dimentional
array of byte)

And I'm having problems with:
line 31: Dim s As New MemoryStream(Content)
shows an error (Content is a type and cannot be used as an expression)

Line 57: g.InterpolationMode =
System.Drawing.Drawing2D.InterpolationMode.HighQua lityBicubic()
Shows an error (Expression is not an array or method and cannot have an
arguement list)

Lines 66 & 67:
stream.Close()
stream.Dispose()

Shows an error: (reference to a non shared member requires an object
reference)

Finaly lines 70 & 73 reference a 'bmp' how do I declare that - dim bmp as
new bitmap?

I'm keen to sort this out as I have tried many ways to get a proportional
thumbnail without success!!

Thanks


Aug 5 '08 #3
Hi Alexey

Just got this working: Heres the code

Imports System.Data.SqlClient
Imports System.IO
Imports System.Drawing
Imports System.Drawing.Imaging

Partial Class showPicture
Inherits System.Web.UI.Page

Protected Sub Page_Load(ByVal sender As Object, ByVal e As
System.EventArgs) Handles Me.Load
Dim ID As Integer = Convert.ToInt32(Request.QueryString("PictureID"))

'Connect to the database and bring back the image contents & MIME
type for the specified picture
Using myConnection As New
SqlConnection(ConfigurationManager.ConnectionStrin gs("picturesConnectionString").ConnectionString)

Const SQL As String = "SELECT [ID], [MIMEtype], [Image] FROM
[Pictures] WHERE [ID] = @PictureID"
Dim myCommand As New SqlCommand(SQL, myConnection)
myCommand.Parameters.AddWithValue("@PictureID", ID)

myConnection.Open()
Dim myReader As SqlDataReader = myCommand.ExecuteReader

If myReader.Read Then
Response.ContentType = myReader("MIMEtype").ToString()
End If
Dim content As Byte() = (myReader("Image"))

Dim lnWidth As Integer = 200
Dim lnHeight As Integer = 200

Dim s As New MemoryStream(content)
Dim image As New Bitmap(s)

Dim bmpOut As System.Drawing.Bitmap

Try
Dim loBMP As New Bitmap(s)
Dim loFormat As ImageFormat = loBMP.RawFormat
Dim lnRatio As Decimal
Dim lnNewWidth As Integer = 0
Dim lnNewHeight As Integer = 0

If loBMP.Width loBMP.Height Then
lnRatio = CDec(lnWidth) / loBMP.Width
lnNewWidth = lnWidth
Dim lnTemp As Decimal = loBMP.Height * lnRatio
lnNewHeight = CInt(lnTemp)
Else
lnRatio = CDec(lnHeight) / loBMP.Height
lnNewHeight = lnHeight
Dim lnTemp As Decimal = loBMP.Width * lnRatio
lnNewWidth = CInt(lnTemp)
End If

bmpOut = New Bitmap(lnNewWidth, lnNewHeight)
Dim g As Graphics = Graphics.FromImage(bmpOut)
g.InterpolationMode =
System.Drawing.Drawing2D.InterpolationMode.HighQua lityBicubic
g.FillRectangle(Brushes.White, 0, 0, lnNewWidth, lnNewHeight)
g.DrawImage(loBMP, 0, 0, lnNewWidth, lnNewHeight)

loBMP.Dispose()
Catch
Return
End Try

myConnection.Close()
myReader.Dispose()

Try
bmpOut.Save(Response.OutputStream,
System.Drawing.Imaging.ImageFormat.Jpeg)
Catch
Finally
bmpOut.Dispose()
End Try
End Using
End Sub
End Class
All I need to do now is position the resultant thumbnail in a div correctly
and were done - hurrah!!

Thanks for your help Alexey
Aug 5 '08 #4
On Aug 5, 5:26*pm, James Page <JamesP...@discussions.microsoft.com>
wrote:
Hi Alexey

Just got this working: Heres the code

Imports System.Data.SqlClient
Imports System.IO
Imports System.Drawing
Imports System.Drawing.Imaging

Partial Class showPicture
* * Inherits System.Web.UI.Page

* * Protected Sub Page_Load(ByVal sender As Object, ByVal e As
System.EventArgs) Handles Me.Load
* * * * Dim ID As Integer = Convert.ToInt32(Request.QueryString("PictureID"))

* * * * 'Connect to the database and bring back the image contents & MIME
type for the specified picture
* * * * Using myConnection As New
SqlConnection(ConfigurationManager.ConnectionStrin gs("picturesConnectionStr*ing").ConnectionString)

* * * * * * Const SQL As String = "SELECT [ID], [MIMEtype],[Image] FROM
[Pictures] WHERE [ID] = @PictureID"
* * * * * * Dim myCommand As New SqlCommand(SQL, myConnection)
* * * * * * myCommand.Parameters.AddWithValue("@PictureID", ID)

* * * * * * myConnection.Open()
* * * * * * Dim myReader As SqlDataReader = myCommand.ExecuteReader

* * * * * * If myReader.Read Then
* * * * * * * * Response.ContentType = myReader("MIMEtype").ToString()
* * * * * * End If
* * * * * * Dim content As Byte() = (myReader("Image"))

* * * * * * Dim lnWidth As Integer = 200
* * * * * * Dim lnHeight As Integer = 200

* * * * * * Dim s As New MemoryStream(content)
* * * * * * Dim image As New Bitmap(s)

* * * * * * Dim bmpOut As System.Drawing.Bitmap

* * * * * * Try
* * * * * * * * Dim loBMP As New Bitmap(s)
* * * * * * * * Dim loFormat As ImageFormat = loBMP.RawFormat
* * * * * * * * Dim lnRatio As Decimal
* * * * * * * * Dim lnNewWidth As Integer = 0
* * * * * * * * Dim lnNewHeight As Integer = 0

* * * * * * * * If loBMP.Width loBMP.Height Then
* * * * * * * * * * lnRatio = CDec(lnWidth) / loBMP..Width
* * * * * * * * * * lnNewWidth = lnWidth
* * * * * * * * * * Dim lnTemp As Decimal = loBMP.Height * lnRatio
* * * * * * * * * * lnNewHeight = CInt(lnTemp)
* * * * * * * * Else
* * * * * * * * * * lnRatio = CDec(lnHeight) / loBMP.Height
* * * * * * * * * * lnNewHeight = lnHeight
* * * * * * * * * * Dim lnTemp As Decimal = loBMP.Width * lnRatio
* * * * * * * * * * lnNewWidth = CInt(lnTemp)
* * * * * * * * End If

* * * * * * * * bmpOut = New Bitmap(lnNewWidth, lnNewHeight)
* * * * * * * * Dim g As Graphics = Graphics.FromImage(bmpOut)
* * * * * * * * g.InterpolationMode =
System.Drawing.Drawing2D.InterpolationMode.HighQua lityBicubic
* * * * * * * * g.FillRectangle(Brushes.White, 0, 0, lnNewWidth, lnNewHeight)
* * * * * * * * g.DrawImage(loBMP, 0, 0, lnNewWidth, lnNewHeight)

* * * * * * * * loBMP.Dispose()
* * * * * * Catch
* * * * * * * * Return
* * * * * * End Try

* * * * * * myConnection.Close()
* * * * * * myReader.Dispose()

* * * * * * Try
* * * * * * * * bmpOut.Save(Response.OutputStream,
System.Drawing.Imaging.ImageFormat.Jpeg)
* * * * * * Catch
* * * * * * Finally
* * * * * * * * bmpOut.Dispose()
* * * * * * End Try
* * * * End Using
* * End Sub
End Class

All I need to do now is position the resultant thumbnail in a div correctly
and were done - hurrah!!

Thanks for your help Alexey
Great, glad it works :-)
Aug 5 '08 #5

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

2
by: wtgee | last post by:
I posted this elsewhere but got no answer so I thought I would see if anyone here is smarter. :) I am creating a image management system and have a few questions, if anyone could help 1) I...
0
by: Michael Rostkowski | last post by:
I posted this in alt.php, but as a reply, so now I'm posting it here for people who might have missed it but still could find it useful. Thanks to Andy Hassall for giving me good information. ...
11
by: Michel | last post by:
Here is a litle script that preload images and show a thumbnail. Once you get on the picture you see the real size It worsk fine with normal picture but when the url has some parameters like in...
11
by: Ian Davies | last post by:
Hello Im having problems displaying my images as thumbnails in a table. My code for producing the new width and height from the original image is as follows...
2
by: Celine | last post by:
I am building a website using C#, asp.net and SqlServer. I need to store a lot of images in my database. I need to store thumbnails but also larger pictures(when user clicks thumbnails a larger...
2
by: S.Creek | last post by:
Hi, I need to take few files (images in my case) and create one file out of them, this file should be accessed so i can grab a single image from it if necessary, i thought of taking all the...
16
by: Stan The Man | last post by:
I'm a CSS novice trying unsuccessfully to make three thumbnail images display horizontally instead of vertically. I suspect I'm missing something really stupid but I'll take the flak if someone...
3
by: =?Utf-8?B?UiBSZXllcw==?= | last post by:
Hi! This discussion may help other programmers get a better idea of how to save uploaded images through a website. Why? Well currently, I save 3 versions of every uploaded image on my own...
1
by: onyris | last post by:
Hi guys , I have a problem trying to unload some images from a movie clip , not sure what i'm doing wrong , if anyone can help me please.. What i have is a movie clip called " thumbnails" on...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, youll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
1
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...
1
by: Defcon1945 | last post by:
I'm trying to learn Python using Pycharm but import shutil doesn't work
1
by: Shllpp 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
by: af34tf | last post by:
Hi Guys, I have a domain whose name is BytesLimited.com, and I want to sell it. Does anyone know about platforms that allow me to list my domain in auction for free. Thank you
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome former...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.