<body>
<img src="fj_map.png" border="0" usemap="#planetmap" alt="Planets" height="550" width="550" />
<map name="planetmap" id="planetmap">
<area
shape="circle"
coords="330,375,35"
href ="http://www.w3school.com.cn/tiy/t.asp?f=html_areamap"
target ="_blank"
alt="quanz" />
<area
shape="circle"
coords="366,305,25"
href ="http://www.baidu.com/"
target ="_blank"
alt="put" />
<area
shape="circle"
coords="420,235,54"
href ="http://www.baidu.com/"
target ="_blank"
alt="fuz" />
<area
shape="circle"
coords="280,410,23"
href ="hhttp://www.w3school.com.cn/tiy/t.asp?f=html_areamap"
target ="_blank"
alt="xiam" />
<area
shape="circle"
coords="203,446,57"
href ="http://www.qzwb.com"
target ="_blank"
alt="zhangz" />
<area
shape="circle"
coords="450,125,59"
href ="http://www.baidu.com/"
target ="_blank"
alt="ningd" />
<area
shape="circle"
coords="195,240,50"
href ="http://www.baidu.com/"
target ="_blank"
alt="longy" />
<area
shape="rect"
coords="100,314,200,380"
href ="http://www.baidu.com/"
target ="_blank"
alt="sanm" />
<area
shape="polygon"
coords="258,215,315,148,225,40,134,110"
href ="http://www.baidu.com/"
target ="_blank"
alt="sanm" />
</map>
</body>
分享到:
相关推荐
1. **初始化地图**:在`map.html`中,使用高德地图API初始化地图,设置中心点、缩放级别等属性。 2. **监听地图事件**:注册地图的`touchstart`、`touchmove`和`touchend`事件,获取触摸事件的坐标,计算出地图的...
在上面的例子中,`<img>`标签的`usemap`属性引用了`<map>`的`name`属性,这样就能将图像与映射关联起来。`<area>`元素则定义了具体的可点击区域,包括形状(如矩形`rect`、圆形`circle`、多边形`polygon`等)、坐标...
其中,`usemap`属性的值(`#mapName`)与`<map>`的`name`属性匹配,`area`标签则定义了图像中的可点击区域。 2. **`<area>`标签** `area`标签用于定义`<map>`内的可点击区域。它有以下几个关键属性: - `shape`...
这是一个使用HTML5 Canvas绘制中国地图的例子,展示了Canvas API如何用于地理数据可视化。Canvas允许开发者在网页上进行动态图形绘制,通过JavaScript控制图形的绘制、擦除和更新。 - `...
在这个例子中,`name`属性指定了地图的名称,必须与`<img>`标签中的`usemap`属性值相匹配。 ##### 2.3 `<area>`标签 `<area>`标签用于定义图像中的一个热点区域,可以通过点击这个区域来跳转到指定的URL。 **属性...
【标题】:“baiduMap_openlayer(openlayer加载百度地图例子)” 在GIS(地理信息系统)领域,集成不同的地图服务是常见的需求。本示例重点展示了如何利用OpenLayers库加载百度地图,让开发者能够在一个Web应用中...
本文将深入探讨基于Baidu Map API 1.2+版本的百度地图类库中的富标注类,这是一种强大的JavaScript技术,旨在为开发者提供更丰富、更具交互性的地图标注功能。富标注类允许用户在百度地图上创建个性化且功能多样的...
在网页设计中,`<map>`标签尤其适用于创建复杂的交互式地图,如城市地图或导航图。 博文链接提供的资源可能是一个关于如何使用`<map>`标签的实际示例,其中`city_map.gif`可能是包含不同城市区域的静态图像,而`a....
通过这个"google Map api v3学习例子",你可以逐步掌握如何利用Google Maps API V3构建交互式地图应用,包括添加标记、处理事件、展示叠加层等功能。实践中不断探索,你会发现Google Maps API V3的强大和灵活性,能...
在IT行业中,Google Map API是一个强大的工具,它允许开发者在网页上嵌入地图,并通过JavaScript进行高度自定义,实现各种功能。在这个主题中,我们主要关注"google map api"的两个实例,即“自定义标记”和“拖动点...
6. **地图API的集成**:在HTML文件中,通常会引入百度地图的JavaScript库(如`<script src="http://api.map.baidu.com/api?v=3.0&ak=您的密钥"></script>`),然后在JavaScript代码中实例化地图对象,设置地图的中心...
在这个例子中,压缩包中的"china-map"文件可能包含了JSON格式的中国地图数据。 ```javascript echarts.registerMap('china', require('./china-map')); // 注意路径应对应实际文件位置 ``` **三、配置项与数据绑定...
在描述中同样提到了“map-api-example”,这可能是一个开源项目或者教程,用于展示如何使用特定的地图API来创建地图应用。开发者通常会通过这样的例子学习如何请求地图数据,设置标记,添加自定义图层,以及处理用户...
实现这个web地图例子的基本步骤如下: 1. **安装与配置**:首先,你需要在本地安装PostgreSQL数据库并启用PostGIS扩展。然后,设置GeoServer并连接到PostGIS数据库,导入所需的地理空间数据。 2. **数据准备**:将...
这个例子中,我们创建了一个自定义覆盖物`RadarOverlay`,它继承自AMAP的`Overlay`类。`initialize`方法用于生成雷达图形的SVG元素并添加到地图容器中。`setPosition`方法用来更新雷达的位置。 要实现雷达的动态...
在IT行业中,地图服务是应用广泛的一个领域,特别是在地理信息系统(GIS)和移动应用中。本文将深入探讨“Map覆盖物添加demo”这一主题,它涉及到如何在地图上添加自定义元素,以增强地图的可视化效果和交互性。我们...
谷歌地图API是一个强大的工具,它允许开发者在网页上嵌入地图并进行...这通常通过在HTML文件中插入一个JavaScript标签来完成,其中src属性指向谷歌地图API的URL,并附带一个API密钥以确保合法访问。例如: ```html ...
说到地图,"带地图地理位置.html"可能结合了HTML5的Geolocation API和地图服务(如Google Maps或OpenStreetMap),展示了如何在网页中集成动态地图。开发者可以利用这些服务创建带有标记、路线规划等功能的交互式...
在这个例子中,`<map>`标签的`name`属性是"imageMap",`<img>`标签通过`usemap="#imageMap"`引用了这个映射。`<area>`标签则定义了图像上不同形状的可点击区域,`shape`属性指定了形状类型(如矩形`rect`、圆形`...