Question regarding images and adding watermark.

Question

User-883621491 posted

Hello. I am new to ASP.NET. I am displaying an image in a web page, and I would like to add a watermark to it. I am retrieving the image from a database and displaying it directly without writing to a file. I found some sample code and modified it to work as I wanted it to, except now I need to add the watermark. I am not sure how to go about doing that, and I am hoping someone can take the code below and show me how to modify it to add a watermark. The watermark can be another image or text.

Protected Sub getPicture(ByRef aID As String, ByRef imageControl As System.Web.UI.WebControls.Image)
    Dim ConnString As String = ConfigurationManager.ConnectionStrings("DBConnString").ConnectionString
    Dim dr As SqlDataReader = Nothing

    Using con As New SqlConnection(ConnString)
        Using cmd As New SqlCommand("SELECT * FROM aDB WHERE ID=" & aID, con)
            cmd.CommandType = CommandType.Text
            con.Open()
            dr = cmd.ExecuteReader()
            If dr.HasRows Then
                dr.Read()
                If Not IsDBNull(dr.GetValue(dr.GetOrdinal("IMAGE"))) Then
                    Dim aPicture() As Byte = dr.GetProviderSpecificValue(dr.GetOrdinal("IMAGE")).Value
                    Dim base64String As String = Convert.ToBase64String(aPicture, 0, aPicture.Length)
                    imageControl.ImageUrl = Convert.ToString("data:image/png;base64,") & base64String
                End If
            End If
            dr.Close()
            con.Close()
        End Using
    End Using
End Sub

Answer 1

User1208776063 posted

 M-Clark

how to modify it to add a watermark. The watermark can be another image or text.

There are lot of commercial products to add high-quality watermark and copyright text for images. But, you can use System.Drawing to create watermark or additional text. But, you would have to convert the blob data or the value you are getting from database to stream. Then, check the below link for sample code.

• Watermark images with C#

You would have to use Drawing.Image.FromStream() instead of Drawing.Image.FromFile() as you are not saving the image data to a file.  I would recommend creating a helper class with a method to create watermark and calling that method from your page.  You can also add watermark at runtime which updates images through HttpHandlers

•  Watermark images at Runtime

Try the first approach and see if it works.

Answer 2

User-821857111 posted

You can use the WebImage class to do this. It has an AddTextWaterMark method: http://msdn.microsoft.com/en-us/library/system.web.helpers.webimage_methods(v=vs.111).aspx

The WebImage class is in System.Web.Helpers which is part of the ASP.NET Web Pages framework. If you are using Web Forms or MVC, you will need to add a reference to the assembly (System.Web.Helpers.dll). It can usually be found in C:\Program Files (x86)\Microsoft ASP.NET\ASP.NET Web Pages\v2.0\Assemblies

You code will look something like this (not tested)

Protected Sub getPicture(ByRef aID As String, ByRef imageControl As System.Web.UI.WebControls.Image)
    Dim ConnString As String = ConfigurationManager.ConnectionStrings("DBConnString").ConnectionString
    Dim dr As SqlDataReader = Nothing

    Using con As New SqlConnection(ConnString)
        Using cmd As New SqlCommand("SELECT * FROM aDB WHERE ID=" & aID, con)
            cmd.CommandType = CommandType.Text
            con.Open()
            dr = cmd.ExecuteReader()
            If dr.HasRows Then
                dr.Read()
                If Not IsDBNull(dr.GetValue(dr.GetOrdinal("IMAGE"))) Then
                    Dim image As New WebImage(dr.GetProviderSpecificValue(dr.GetOrdinal("IMAGE")).Value)
                    image.AddTextWaterMark("Some Text")
                    Dim aPicture() as Byte() = image.GetBytes()
                    Dim base64String As String = Convert.ToBase64String(aPicture, 0, aPicture.Length)
                    imageControl.ImageUrl = Convert.ToString("data:image/png;base64,") & base64String
                End If
            End If
            dr.Close()
            con.Close()
        End Using
    End Using
End Sub

Answer 3

User-883621491 posted

Thank you! That appears to work fine. I had to install MVC 3 (http://www.asp.net/mvc/mvc3), but once I did that then I was able to add the reference. Just for anyone else's information that may need this, I had to change the code you provided slightly. Just wanted to respond back so it would be here for others:

Protected Sub getPicture(ByRef aID As String, ByRef imageControl As System.Web.UI.WebControls.Image)
    Dim ConnString As String = ConfigurationManager.ConnectionStrings("DBConnString").ConnectionString
    Dim dr As SqlDataReader = Nothing

    Using con As New SqlConnection(ConnString)
        Using cmd As New SqlCommand("SELECT * FROM aDB WHERE ID=" & aID, con)
            cmd.CommandType = CommandType.Text
            con.Open()
            dr = cmd.ExecuteReader()
            If dr.HasRows Then
                dr.Read()
                If Not IsDBNull(dr.GetValue(dr.GetOrdinal("IMAGE"))) Then
                   Dim aPicture() As Byte = dr.GetProviderSpecificValue(dr.GetOrdinal("IMAGE")).Value
                   Dim image As New WebImage(aPicture)
                   image.AddTextWaterMark("Some Text")
                   Dim base64String As String = Convert.ToBase64String(image.GetBytes, 0, image.GetBytes.Length)
                   imageControl.ImageUrl = Convert.ToString("data:image/png;base64,") & base64String
                End If
            End If
            dr.Close()
            con.Close()
        End Using
    End Using
End Sub

Thanks again!

Answer 4

User-821857111 posted

I had to install MVC 3

Alternatively, you could have installed ASP.NET Web Pages: http://www.asp.net/web-pages but you would have ended up with WebMatrix too.