<html lang="en">
<head>
<meta charset="UTF-8">
<title>Map 定位</title>
</head>
<body>
<p>长方形</p>
<p>宽：270px</p>
<p>高：200px</p>
<p>rect代表矩形</p>
<p>circle代表圆形</p>
<p>poly代表多边形</p>
<img src="http://chuantu.biz/t6/223/1518055680x-1566657902.png" border="0" usemap="planetmap" alt="Planets" />
<map name="planetmap" id="planetmap">
<area shape="rect"
coords="0,0,270,198"
href="http://www.baidu.com/index.php"
alt="yahu"
target="_blank">
<area shape="rect"
coords="310,198,580,0"
href="http://www.baidu.com/index.php"
alt="baidu"
target="_blank">
<area shape="rect"
coords="620,198,890,0"
href="http://www.baidu.com/index.php"
alt="baidu"
target="_blank">
<area shape="rect"
coords="930,198,1200,0"
href="http://www.baidu.com/index.php"
alt="baidu"
target="_blank">
<area shape="rect"
coords="0,218,270,418"
href="http://www.baidu.com/index.php"
alt="baidu"
target="_blank">
<area shape="rect"
coords="310,418,580,218"
href="http://www.baidu.com/index.php"
alt="baidu"
target="_blank">
<area shape="rect"
coords="620,418,890,218"
href="http://www.baidu.com/index.php"
alt="baidu"
target="_blank">
<area shape="rect"
coords="930,418,1200,218"
href="http://www.baidu.com/index.php"
alt="baidu"
target="_blank">
<!--coords="84,460,38" 84:左侧到右侧的距离 460：从上到下的距离 38：半径 -->
<area shape="circle"
coords="84,460,38"
href="http://www.baidu.com/index.php"
alt="baidu"
target="_blank">
<!-- 多边形，每个定点都有一个坐标。当shape是poly多边形时，coords表示多边形所有顶点的坐标(x1,y1),(x2,y2),(x3,y3)... -->
<area shape="poly"
coords="278,422,250,457,276,493,316,482,320,441"
href="http://www.baidu.com/index.php"
alt="baidu"
target="_blank">
<area shape="poly"
coords="441,454,473,493,495,444"
href="http://www.baidu.com/index.php"
alt="baidu"
target="_blank">
<area shape="poly"
coords="590,416,570,428,560,448,565,478,575,491,602,496,623,487,636,467,633,441,618,423"
href="http://www.baidu.com/index.php"
alt="baidu"
target="_blank">
</map>
</body>
</html>