怎么给网页使用map的area标签创建的不规则区域设置颜色？？？

caomengjida 2013-10-30 02:46:34

请教大神，有没有办法给使用map的area创建的不规则区域设置颜色？
比如中国地图吧，分省区单独设置颜色，然后根据点击改变被点击省区的颜色
或者改用其他办法，只要能实现这个目的就行

...全文

632 4 打赏收藏转发到动态举报

写回复

4 条回复

切换为时间正序

请发表友善的回复…

发表回复

zixiao123 2013-11-01

打赏
举报

回复

我也遇到这问题，maparea如果搬到手机里就是方形了。特是uc,更惨。 http://www.oschina.net/code/snippet_942530_17658

caomengjida 2013-10-30

打赏
举报

回复

是这样的，颜色要能够灵活设置，而且有很多个区域需要区分设置，就像中国地图每个省都能分开设置不同的颜色，使用图片肯定是不行的

KK3K2005 2013-10-30

打赏
举报

回复

就用png 图片拼吧

未知数 2013-10-30

打赏
举报

回复

给map的area设置颜色，可以点击时换图片，虽然麻烦点，但确实可以实现不过感觉还是用flash做好

Area标签高亮Map area标签的基础知识Map area的具体用法Area标签设置样式的问题使用jquery.maphilight.js库改变area背景效果图片展示基础使用方法附上github的实例，讲的比我清楚结束 Map area标签的基础知识公司要求写一个demo案例，需要用到图片热区，此时便想到了html中的map+area功能，该功能可以实现图片热区的添加。具体的Map area百科 Map area的具体用法 https://www.cnblogs.com/mq0036/p/33373

在购物网站 Landing page 页，往往会存在商品宣传信息，为提升首页加载速度，往往会使用一张图片来包含所有要展示商品（① 减少http请求个数；② 减少页面DOM数）。如何在一张商品海报上，实现点击某商品，跳转到该商品详情页面？以上，也可以使用指定不规则的热点（可点击）区域。HTML与一起使用来定义一个图像映射 (一个可点击的链接区域)。

html图片热区map、area的使用在项目中需要点击图片某个位置，然后变换不同的颜色。之前听说dw可以通过拖拽实现，也可以通用canvas画布实现，但是太麻烦了而map的area可以定义一个坐标位置然后点击处理，因为在项目中只是需要变换所点击的不规则区域的位置，然后进行图片切换就可以，可以使用css定位然后禁止area的跳转即可 <area> 标签的 coords 属性定义了客户端图像映射中对鼠标敏感的区域的坐标。坐标的数字及其含义取决于 shape 属性中决定的区域

在制作区域地图时，往往我们会因为没有地图的坐标数据，无法使用Echarts来绘制地图，这时候我们可以使用HTML的usemap属性来完成地图效果。比如鼠标指到指定的地图区域，该区域高亮显示，然后显示该区域的一些基本信息，还有一些点击事件处理等等。示例图片：一、HTML的usemap属性 img标签的usemap属性：它可以指定一个map标签 map标签：地图集合。必须包含name属性 area标签：区域坐标集合。shape指区域的形状，包括矩形rect、圆形circle、多边形polygon；co.

干什么用的 &lt;map&gt; 标签一般与 &lt;area&gt; 标签一起使用，来定义一个图像映射（也就是一个可点击的链接区域）。这么来说吧，如果让你在一个区域添加一个点击热点，你怎么加？如上图，蓝色标记的区域，需要给这块区域添加一个点击，你可能说，加一个绝对定位的 div 块上去，然后给这个 div 块绑定事件就好了。嗯，对。这是很有效的一种方法。但如果不让用 js 来实现呢？ ...

61,129

社区成员

60,711

社区内容

发帖

与我相关

我的任务

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章