Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

Drawing image and add hyperlink into the image

Posted on 2006-11-22
4
Medium Priority
?
419 Views
Last Modified: 2013-12-03
I have a program to draw an image, and within the image itself I need to add some hyperlink into it. For example in the below codes, X, Y & Z will open a new window and link to a file share site, i.e: X link to //fileshare/folder1, Y link to //fileshare/folder2, and Z will link to //fileshare/folder3. My problem here is how to link the X, Y & Z to the related site.

  Bitmap objBitmap;
        Graphics objGraphics;
       
        int XLen = 500;
        int YLen = 500;
        int factor = 27;

        objBitmap = new Bitmap(500, 500);
        objGraphics = Graphics.FromImage(objBitmap);

        objGraphics.Clear(Color.White);

        Pen p = new Pen(Color.Yellow, 0);
        int XRectLen = 520;
        int YRectLen = 520;
        Rectangle rect = new Rectangle(0, 0, XRectLen, YRectLen);

        Rectangle rect1 = new Rectangle(0, 0, 500, 500);
        SolidBrush KhakiBrush = new SolidBrush(Color.Khaki);

        objGraphics.FillEllipse(KhakiBrush, rect1);
       
        FontFamily fontfml = new FontFamily(GenericFontFamilies.Serif);
        Font font = new Font(fontfml, 10);
        SolidBrush brush = new SolidBrush(Color.Blue);

        StringFormat drawFormat = new StringFormat();
        drawFormat.FormatFlags = StringFormatFlags.DirectionVertical;

        objGraphics.DrawString("X", font, brush, 340, 360);
        objGraphics.DrawString("Y", font, brush, 230, 200);
        objGraphics.DrawString("Z", font, brush, 210, 380);
       
        objBitmap.Save(Response.OutputStream, ImageFormat.Gif);
        objBitmap.Save(Server.MapPath("x.jpg"), ImageFormat.Jpeg);
        objBitmap.Dispose();
        objGraphics.Dispose();  


Please help. Thanks.
0
Comment
Question by:silterra
  • 2
  • 2
4 Comments
 
LVL 15

Expert Comment

by:ozymandias
ID: 18003534
You cannot add hyperlinks to an image.
You need to create an Image Map from the image so that when the image is displayed to a user on a web page they can click on the areas in the ikmage that contain the text and go to the hyperlinks.

Here is an example that incorporates your code :

using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Drawing.Imaging;
using System.Drawing.Text;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;

namespace WebImageMap
{
      /// <summary>
      /// Summary description for WebForm1.
      /// </summary>
      public class WebForm1 : System.Web.UI.Page
      {
            private void Page_Load(object sender, System.EventArgs e)
            {
                  System.Web.UI.WebControls.Image myImage = new System.Web.UI.WebControls.Image();
                  myImage.ImageUrl = "x.jpg";
                  myImage.Attributes.Add("usemap","#imagemap1");
                  this.Controls.Add(myImage);

                  HtmlGenericControl map = new HtmlGenericControl("map");
                  map.Attributes.Add("name","imagemap1");
                  Rectangle[] rects = this.MakeImage();
                  foreach(Rectangle rect in rects){
                        HtmlGenericControl area = new HtmlGenericControl("area");
                        area.Attributes.Add("shape","rect");
                        area.Attributes.Add("coords", rect.Left.ToString() + "," + rect.Top.ToString() + "," + (rect.Left + rect.Width).ToString() + "," + (rect.Top + rect.Height).ToString());
                        area.Attributes.Add("href","#");
                        map.Controls.Add(area);
                  }
                  this.Controls.Add(map);
            }


            private Rectangle[] MakeImage(){
                  Bitmap objBitmap;
                  Graphics objGraphics;
       
                  int XLen = 500;
                  int YLen = 500;
                  int factor = 27;
                  Rectangle r1;
                  Rectangle r2;
                  Rectangle r3;

                  objBitmap = new Bitmap(500, 500);
                  objGraphics = Graphics.FromImage(objBitmap);

                  objGraphics.Clear(Color.White);

                  Pen p = new Pen(Color.Yellow, 0);
                  int XRectLen = 520;
                  int YRectLen = 520;
                  Rectangle rect = new Rectangle(0, 0, XRectLen, YRectLen);

                  Rectangle rect1 = new Rectangle(0, 0, 500, 500);
                  SolidBrush KhakiBrush = new SolidBrush(Color.Khaki);

                  objGraphics.FillEllipse(KhakiBrush, rect1);
       
                  FontFamily fontfml = new FontFamily(GenericFontFamilies.Serif);
                  Font font = new Font(fontfml, 10);
                  SolidBrush brush = new SolidBrush(Color.Blue);

                  StringFormat drawFormat = new StringFormat();
                  drawFormat.FormatFlags = StringFormatFlags.DirectionVertical;

                  objGraphics.DrawString("X", font, brush, 340, 360);
                  SizeF textsize = objGraphics.MeasureString("Y", font);
                  r1 = new Rectangle(340, 360, (int)textsize.Width, (int)textsize.Height);
                  textsize = objGraphics.MeasureString("Y", font);
                  objGraphics.DrawString("Y", font, brush, 230, 200);
                  r2 = new Rectangle(230, 200, (int)textsize.Width, (int)textsize.Height);
                  textsize = objGraphics.MeasureString("Z", font);
                  objGraphics.DrawString("Z", font, brush, 210, 380);
                  r3 = new Rectangle(210, 380, (int)textsize.Width, (int)textsize.Height);
       
                  //objBitmap.Save(Response.OutputStream, ImageFormat.Gif);
                  objBitmap.Save(Server.MapPath("x.jpg"), ImageFormat.Jpeg);
                  objBitmap.Dispose();
                  objGraphics.Dispose();  

                  return new Rectangle[]{r1, r2, r3};

            }

            #region Web Form Designer generated code
            override protected void OnInit(EventArgs e)
            {
                  //
                  // CODEGEN: This call is required by the ASP.NET Web Form Designer.
                  //
                  InitializeComponent();
                  base.OnInit(e);
            }
            
            /// <summary>
            /// Required method for Designer support - do not modify
            /// the contents of this method with the code editor.
            /// </summary>
            private void InitializeComponent()
            {    
                  this.Load += new System.EventHandler(this.Page_Load);
            }
            #endregion
      }
}
0
 

Author Comment

by:silterra
ID: 18005504
Hi ozymandias,

Thanks for your feedback, let me try it out.

0
 

Author Comment

by:silterra
ID: 18026360
Hi ozymandias,

Thanks a lot, it's work!!!

But I have a message displayed [object] in the main window after I clicked on the hyperlink, where the hyperlink will open a new browser window. I had changed the code below
      area.Attributes.Add("href","#")
               to
      area.Attributes.Add("href", "javascript:window.open('testX.aspx','Window1','height=550, width=550,status= no, resizable= no, scrollbars=no, toolbar=no,location=no,menubar=no ');");

Advenced thanks for your help.
0
 
LVL 15

Accepted Solution

by:
ozymandias earned 2000 total points
ID: 18026739
If you call javascript from the href of an area it seems tp try to valigate to the result of the function.
Even if you return false it causes a problem.
They might be able to help you with this in the HTML Topic Area.
The best I can come up with is this :

-> create a function and call the function from the onClick event of the area.
-> set the href to #
-> when the user clicks on the area they will get the new window and the main window will be refreshed.

using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Drawing.Imaging;
using System.Drawing.Text;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;

namespace WebImageMap
{
      /// <summary>
      /// Summary description for WebForm1.
      /// </summary>
      public class WebForm1 : System.Web.UI.Page
      {
            private void Page_Load(object sender, System.EventArgs e)
            {
                  System.Web.UI.WebControls.Image myImage = new System.Web.UI.WebControls.Image();
                  myImage.ImageUrl = "x.jpg";
                  myImage.Attributes.Add("usemap","#imagemap1");
                  this.Controls.Add(myImage);

                  this.RegisterClientScriptBlock("windowscript", "<script>function OpenTest(){window.open('webform1.aspx','Window1','height=550, width=550,status= no, resizable= no, scrollbars=no, toolbar=no,location=no,menubar=no');return false;}</script>");

                  HtmlGenericControl map = new HtmlGenericControl("map");
                  map.Attributes.Add("name","imagemap1");
                  Rectangle[] rects = this.MakeImage();
                  foreach(Rectangle rect in rects){
                        HtmlGenericControl area = new HtmlGenericControl("area");
                        area.Attributes.Add("shape","rect");
                        area.Attributes.Add("coords", rect.Left.ToString() + "," + rect.Top.ToString() + "," + (rect.Left + rect.Width).ToString() + "," + (rect.Top + rect.Height).ToString());
                        area.Attributes.Add("href", "#");
                        area.Attributes.Add("onClick", "OpenTest();");
                        map.Controls.Add(area);
                  }
                  this.Controls.Add(map);
            }


            private Rectangle[] MakeImage(){
                  Bitmap objBitmap;
                  Graphics objGraphics;
       
                  int XLen = 500;
                  int YLen = 500;
                  int factor = 27;
                  Rectangle r1;
                  Rectangle r2;
                  Rectangle r3;

                  objBitmap = new Bitmap(500, 500);
                  objGraphics = Graphics.FromImage(objBitmap);

                  objGraphics.Clear(Color.White);

                  Pen p = new Pen(Color.Yellow, 0);
                  int XRectLen = 520;
                  int YRectLen = 520;
                  Rectangle rect = new Rectangle(0, 0, XRectLen, YRectLen);

                  Rectangle rect1 = new Rectangle(0, 0, 500, 500);
                  SolidBrush KhakiBrush = new SolidBrush(Color.Khaki);

                  objGraphics.FillEllipse(KhakiBrush, rect1);
       
                  FontFamily fontfml = new FontFamily(GenericFontFamilies.Serif);
                  Font font = new Font(fontfml, 10);
                  SolidBrush brush = new SolidBrush(Color.Blue);

                  StringFormat drawFormat = new StringFormat();
                  drawFormat.FormatFlags = StringFormatFlags.DirectionVertical;

                  objGraphics.DrawString("X", font, brush, 340, 360);
                  SizeF textsize = objGraphics.MeasureString("Y", font);
                  r1 = new Rectangle(340, 360, (int)textsize.Width, (int)textsize.Height);
                  textsize = objGraphics.MeasureString("Y", font);
                  objGraphics.DrawString("Y", font, brush, 230, 200);
                  r2 = new Rectangle(230, 200, (int)textsize.Width, (int)textsize.Height);
                  textsize = objGraphics.MeasureString("Z", font);
                  objGraphics.DrawString("Z", font, brush, 210, 380);
                  r3 = new Rectangle(210, 380, (int)textsize.Width, (int)textsize.Height);
       
                  //objBitmap.Save(Response.OutputStream, ImageFormat.Gif);
                  objBitmap.Save(Server.MapPath("x.jpg"), ImageFormat.Jpeg);
                  objBitmap.Dispose();
                  objGraphics.Dispose();  

                  return new Rectangle[]{r1, r2, r3};

            }

            #region Web Form Designer generated code
            override protected void OnInit(EventArgs e)
            {
                  //
                  // CODEGEN: This call is required by the ASP.NET Web Form Designer.
                  //
                  InitializeComponent();
                  base.OnInit(e);
            }
            
            /// <summary>
            /// Required method for Designer support - do not modify
            /// the contents of this method with the code editor.
            /// </summary>
            private void InitializeComponent()
            {    
                  this.Load += new System.EventHandler(this.Page_Load);
            }
            #endregion
      }
}
0

Featured Post

Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article describes a simple method to resize a control at runtime.  It includes ready-to-use source code and a complete sample demonstration application.  We'll also talk about C# Extension Methods. Introduction In one of my applications…
Entity Framework is a powerful tool to help you interact with the DataBase but still doesn't help much when we have a Stored Procedure that returns more than one resultset. The solution takes some of out-of-the-box thinking; read on!
Excel styles will make formatting consistent and let you apply and change formatting faster. In this tutorial, you'll learn how to use Excel's built-in styles, how to modify styles, and how to create your own. You'll also learn how to use your custo…
If you’ve ever visited a web page and noticed a cool font that you really liked the look of, but couldn’t figure out which font it was so that you could use it for your own work, then this video is for you! In this Micro Tutorial, you'll learn yo…
Suggested Courses

876 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question