给图片加热点是web开发中经常用到的一个功能。这方面的工具也不少。
为了更好的满足自己的需求，写了一个winform程序。
可以方便的给图片加热点，更方便灵活！
源码下载 http://download.csdn.net/download/qq_29939347/10150681
生成的代码：
<img src = "D:\12.jpg" usemap = "#Map_2017-12-08-10-49-17" >
<map name="Map_2017-12-08-10-49-17" >
<area shape="polygon" coords="144,229,228,198,266,152,305,181,319,247,405,288,396,324,353,348,340,381,307,391,278,395,280,422,291,427,279,444,284,453,264,461,225,444,187,452,133,465,102,454,90,459,55,459,50,432,17,412,15,395,0,373,11,372,13,310,45,320,83,311,122,301,136,278" href = "http://www.sina.com.cn/" >
<area shape="polygon" coords="784,426,768,475,787,491,815,491,833,475,854,452,863,435,881,418,903,396,867,390,855,408,842,416,830,401" href = "https://www.cnblogs.com/" >
<area shape="polygon" coords="39,474,322,474,322,663,39,663" href = "" >
<area shape="polygon" coords="427,322,567,341,623,322,673,295,681,275,672,257,698,248,746,227,803,173,770,154,721,165,732,126,766,99,768,48,759,22,779,12,786,39,806,49,824,55,844,50,855,87,857,99,821,154,842,181,831,198,889,260,845,301,817,321,740,318,722,348,676,389,655,413,640,433,591,422,589,472,543,432,550,400,505,417,467,382,435,370" href = "" >
</map>
技术要点
1 画图
热点图形有 矩形，多边形，圆形等。为了统一处理，定义了接口：
interface IDrwaShap
{
void Draw(System.Drawing.Graphics g);
string GetLink();
bool Hit(int x, int y);
bool IsChecked();
void SetChecked(bool sel);
void SetEndPoint(System.Drawing.Point end);
void SetLink(string link); void AddPoint(int x,int y); void SetStartMovePoint(int x, int y);
void SetCurMovePoint(int x, int y); int GetShapId(); List<Point> GetPoint(); }
矩形实现类为HotShapRect，多边形为HotShapPoly。
class HotShapPoly : PicHot.IDrwaShap
{
static Pen _drawPen = new Pen(Color.Red, 2);
static Pen _checkedPen = new Pen(Color.Blue, 2); public int _shapId = 0;
private bool _checked = false;
private bool _startMove = false; private Point _moveStartPoint = new Point(0, 0);
string _linkText = string.Empty; List<Point> _listPoint = new List<Point>();
public HotShapPoly()
{
_shapId = AppNum.GetId();
}
public int GetShapId()
{
return _shapId;
} public List<Point> GetPoint()
{
return _listPoint;
}
public void AddPoint(int x, int y)
{
Point newPt = new Point(x,y);
foreach (Point p in _listPoint)
{
if (p == newPt)
return;
} _listPoint.Add(new Point(x, y));
} public void SetLink(string link)
{
_linkText = link;
}
public string GetLink()
{
return _linkText;
}
public void SetEndPoint(Point end)
{
AddPoint(end.X, end.Y);
} public void SetChecked(bool sel)
{
_checked = sel;
_startMove = _checked;
} public bool IsChecked()
{
return _checked;
} public void SetStartMovePoint(int x, int y)
{
_moveStartPoint = new Point(x, y);
}
public void SetCurMovePoint(int x, int y)
{
if (!_startMove)
return; Point moveEndPoint = new Point(x, y);
List<Point> _listPointNew = new List<Point>();
foreach (Point p in _listPoint)
{
int m = p.X + (moveEndPoint.X - _moveStartPoint.X);
int n = p.Y + (moveEndPoint.Y - _moveStartPoint.Y);
_listPointNew.Add(new Point(m,n));
}
_listPoint = _listPointNew; _moveStartPoint = moveEndPoint;
} public void Draw(Graphics g)
{
if (_listPoint.Count <= 2)
return ; Pen pen = _checked ? _checkedPen : _drawPen; g.DrawPolygon(pen, _listPoint.ToArray());
} internal bool IsValidate()
{
if (_listPoint.Count <= 2)
return false;
return true;
} }
2 生成代码
private void buttonCreateHtml_Click(object sender, EventArgs e)
{
StringBuilder sb = new StringBuilder();
MessageBox.Show(this, "代码已复制到剪贴板！");
}
