Question

在ASP.NET使用C＃开发的基于Web的应用程序中，一个图像发送给所有用户，并在特定区域（热点）中嵌入了超链接。我可以发送电子邮件并使用链接映射图像。现在的问题是当我使用另一个不同大小的屏幕时，热点会转到另一个地方。我希望它得到修复。 那怎么做？

我使用以下内容来映射图像：

 body += "<map id ='clickMap' name='clickMap'> " +
                     "<area shape ='rect' coords ='752,394,1394,491' href ='http://pmv/pssp/StartQuiz.aspx?testid=" + quizid + "' alt='Quiz' /></map>";

我的C＃邮件功能：

protected void Page_Load(object sender, EventArgs e)
    {
        Send();
    }


    protected void SendEmail(string toAddresses, string fromAddress, string MailSubject, string MessageBody, bool isBodyHtml, AlternateView av)
    {
        SmtpClient sc = new SmtpClient("MAIL Server");
        try
        {
            MailMessage msg = new MailMessage();
            msg.From = new MailAddress("Test@MAILServer.com", "Test");


            msg.Bcc.Add(toAddresses);
            msg.Subject = MailSubject;
            msg.Body = MessageBody;
            msg.IsBodyHtml = isBodyHtml;
            msg.AlternateViews.Add(av);
            sc.Send(msg);
        }
        catch (Exception ex)
        {
            throw ex;
        }

    }

    protected void Send()
    {
        string connString = "Data Source=localhost\\sqlexpress;Initial Catalog=Test;Integrated Security=True";

        using (SqlConnection conn = new SqlConnection(connString))
        {
            var sbEmailAddresses = new System.Text.StringBuilder(2000);
            string quizid = "";

            // Open DB connection.
            conn.Open();

            string cmdText = "SELECT MIN (QuizID) As mQuizID FROM dbo.QUIZ WHERE IsSent <> 1";
            using (SqlCommand cmd = new SqlCommand(cmdText, conn))
            {
                SqlDataReader reader = cmd.ExecuteReader();
                if (reader != null)
                {
                    while (reader.Read())
                    {
                        // There is only 1 column, so just retrieve it using the ordinal position
                        quizid = reader["mQuizID"].ToString();

                    }
                }
                reader.Close();
            }

            string cmdText2 = "SELECT Username FROM dbo.employee";
            using (SqlCommand cmd = new SqlCommand(cmdText2, conn))
            {
                SqlDataReader reader = cmd.ExecuteReader();
                if (reader != null)
                {
                    while (reader.Read())
                    {
                        var sName = reader.GetString(0);
                        if (!string.IsNullOrEmpty(sName))
                        {
                            if (sbEmailAddresses.Length != 0)
                            {
                                sbEmailAddresses.Append(",");
                            }
                            // Just use the ordinal position for the user name since there is only 1 column
                            sbEmailAddresses.Append(sName).Append("@MailServer.com");
                        }
                    }
                }
                reader.Close();
            }

            string cmdText3 = "UPDATE dbo.Quiz SET IsSent = 1 WHERE QuizId = @QuizID";
            using (SqlCommand cmd = new SqlCommand(cmdText3, conn))
            {
                // Add the parameter to the command
                var oParameter = cmd.Parameters.Add("@QuizID", SqlDbType.Int);

                var sEMailAddresses = sbEmailAddresses.ToString();
                string link = "<a href='http://localhost/StartQuiz.aspx?testid=" + quizid + "'> Click here to participate </a>";
                string body = @"Good day, <br /><br />
                                <b> Please participate</b>"
                                    + link +
                                    @"<br /><br /> <h1>Picture</h1><br/><img src='cid:image1' usemap ='#clickMap' alt='Click HERE'>";


                body += "<map id ='clickMap' name='clickMap'> " +
                     "<area shape ='rect' coords ='752,394,1394,491' href ='http://localhost/StartQuiz.aspx?testid=" + quizid + "' alt='Quiz' /></map>";



            }
            conn.Close();
        }
    }

Answer 1

使用WIDTH和HEIGHT指定图像大小，然后在该约束内提供坐标。

为了举例，我假设您的原始图像尺寸为1600 X 1200像素。使用坐标的热点是coords ='752,394,1394,491'（以像素为单位）。如果你在'img'标签上指定width = 1600和height = 1200，那么热点应该总是在你想要的地方。

但是如果您需要指定不同的尺寸，也许您希望它是800 x 600，那么您可以相应地缩放坐标...

int orig_width = 1600;
int orig_height = 1200;
int design_width = 800;
int design_height = design_width * orig_height / orig_width; // keeps aspect ratio, or just use 600

int coord_x1 = design_width * 752 / orig_width;
int coord_y1 = design_height * 394 / orig_height;
int coord_x2 = design_width * 1394 / orig_width;
int coord_y2 = design_height * 491 / orig_height;

...
string body = @"Good day, <br /><br />   
    <b> Please participate in the new short safety quiz </b>"   
    + link +   
    @"<br /><br /> <h1>Picture</h1><br/><img width='"
    + design_width +
    "' height='"
    + design_height +
    @"' src='cid:image1' usemap ='#clickMap' alt='Click HERE'>";   

// ...

body += "<map id ='clickMap' name='clickMap'> " +   
      "<area shape ='rect' coords ='"
      + coord_x1 + "," + coord_y1 + "," + coord_x2 + "," + coord_y2 +
      "' href ='http://localhost/StartQuiz.aspx?testid="
      + quizid + "' alt='Quiz' /></map>";

如何设置固定的图像映射热点？

1 个答案: