基于Jquery和html5的7款个性化地图插件


Posted in Javascript onNovember 17, 2015

1、HTML5世界地图 划分世界区域并显示国家名

这是一款基于HTML5的世界地图应用,它的特点是可以将地图中的各个国家区域进行划分,鼠标滑过时即可显示该区域对应的国家名称,你也可以对弹出的标签进行自定义文字和自定义样式。

基于Jquery和html5的7款个性化地图插件 

在线演示       源码下载

2、jQuery矢量SVG地图插件JVectorMap

JVectorMap是一款基于jQuery的矢量地图插件,它是基于SVG结构的,和其他jQuery地图插件不同的是,jVectorMap是 矢量地图,但是它同样支持地图缩放和地图平面移动等相应的功能。由于JVectorMap是基于jQuery的,所以支持大部分主流的浏览器,应用也相当 广泛。

基于Jquery和html5的7款个性化地图插件

在线演示        源码下载

3、jQuery中国地图插件

今天要来介绍一款相对更实用些的jQuery中国地图插件,在该实例中,整张中国地图都按各个省份切割,鼠标滑过相应的省份时,即可弹出对应省份的具体介绍。

基于Jquery和html5的7款个性化地图插件

在线演示        源码下载

4、纯CSS3实现地图热点文字标注提示

这款地图应用的特点是地图上有许多标注点,点击标注点即可在页面上弹出一个文字提示框,用来说明该标注点在地图上的详细信息。如果你需要有一款带标注功能的地图应用,那么这款CSS3地图插件可以满足你。

基于Jquery和html5的7款个性化地图插件

在线演示        源码下载

5、HTML5 SVG世界地图 地图可拖拽和缩放

今天要分享的这款HTML5地图应用是一张世界地图,地图元素是使用SVG绘制的,并且地图可以拖拽和局部缩放,效果非常不错。

基于Jquery和html5的7款个性化地图插件

在线演示        源码下载

6、HTML5/CSS3带区域地图的联系表单

今天我们要来分享一款功能更加强大的HTML5/CSS3联系表单,它可以选中不同区域显示相应的地图,然后针对该区域填写联系表单。

基于Jquery和html5的7款个性化地图插件

在线演示        源码下载

7、HTML5 3D实景地图动画 3D效果很酷

今天我们来分享一款全新的HTML5 3D效果,是一款3D实景地图,这款3D地图截取了实景的房屋大厦,并且可以旋转展示,非常酷。

基于Jquery和html5的7款个性化地图插件

在线演示        源码下载

以上就是一些精美的jQuery/HTML5地图插件,如果你也有好的地图插件,欢迎跟我们分享。

Javascript 相关文章推荐
jQuery实现将div中滚动条滚动到指定位置的方法
Aug 10 Javascript
基于SpringMVC+Bootstrap+DataTables实现表格服务端分页、模糊查询
Oct 30 Javascript
flag和jq on 的绑定多个对象和方法(必看)
Feb 27 Javascript
jquery Ajax实现Select动态添加数据
Jun 08 jQuery
详解ES6通过WeakMap解决内存泄漏问题
Mar 09 Javascript
JS验证输入的是否是数字及保留几位小数问题
May 09 Javascript
学习React中ref的两个demo示例
Aug 14 Javascript
js隐式转换的知识实例讲解
Sep 28 Javascript
跨域请求两种方法 jsonp和cors的实现
Nov 11 Javascript
详解elementUI中input框无法输入的问题
Apr 27 Javascript
vue实现下拉菜单树
Oct 22 Javascript
JavaScript中条件语句的优化技巧总结
Dec 04 Javascript
JavaScript设置、获取、清除单值和多值cookie的方法
Nov 17 #Javascript
每天一篇javascript学习小结(RegExp对象)
Nov 17 #Javascript
node.js抓取并分析网页内容有无特殊内容的js文件
Nov 17 #Javascript
js全选按钮的实现方法
Nov 17 #Javascript
javascript实现省市区三级联动下拉框菜单
Nov 17 #Javascript
javascript中return,return true,return false三者的用法及区别
Nov 17 #Javascript
jquery表单验证需要做些什么
Nov 17 #Javascript
You might like
部署PHP项目应该注意的几点事项分享
2013/12/20 PHP
浅谈PHP变量作用域以及地址引用问题
2013/12/27 PHP
PHP中使用GD库创建圆形饼图的例子
2014/11/19 PHP
PHP定时执行任务实现方法详解(Timer)
2015/07/30 PHP
PHP实现QQ登录的开原理和实现过程
2018/02/04 PHP
php-fpm添加service服务的例子
2018/04/27 PHP
统计PHP目录中的文件数方法
2019/03/05 PHP
PHP cookie,session的使用与用户自动登录功能实现方法分析
2019/06/05 PHP
用Javascript实现UTF8编码转换成gb2312编码
2006/12/22 Javascript
自己封装的javascript事件队列函数版
2014/06/12 Javascript
jquery判断对象是否为空并遍历对象的简单实例
2016/07/26 Javascript
Javascript中常见的逻辑题和解决方法
2016/09/17 Javascript
AngularJS动态绑定ng-options的ng-model实例代码
2017/06/21 Javascript
js实现轮播图的两种方式(构造函数、面向对象)
2017/09/30 Javascript
基于Vue-cli快速搭建项目的完整步骤
2018/11/03 Javascript
HTML+JS实现“代码雨”效果源码(黑客帝国文字下落效果)
2020/03/17 Javascript
如何在JavaScript中使用localStorage详情
2021/02/04 Javascript
[14:03]2017DOTA2亚洲邀请赛开幕式:12神兵演绎水墨中华
2017/04/01 DOTA
在Python下利用OpenCV来旋转图像的教程
2015/04/16 Python
Python cx_freeze打包工具处理问题思路及解决办法
2016/02/13 Python
Python卸载模块的方法汇总
2016/06/07 Python
简单谈谈Python中的闭包
2016/11/30 Python
解决python "No module named pip" 的问题
2018/10/13 Python
详解Python Matplot中文显示完美解决方案
2019/03/07 Python
python global关键字的用法详解
2019/09/05 Python
PyTorch实现更新部分网络,其他不更新
2019/12/31 Python
用python实现一个简单的验证码
2020/12/09 Python
广播电视新闻学专业应届生求职信
2013/10/08 职场文书
给酒店员工的表扬信
2014/01/11 职场文书
市场营销管理毕业生自荐信
2014/03/03 职场文书
预备党员入党自我评价范文
2014/03/10 职场文书
情况说明书格式范文
2014/05/06 职场文书
2014年医生工作总结
2014/11/21 职场文书
地陪导游欢迎词
2015/01/26 职场文书
上级领导检查欢迎词
2015/09/30 职场文书
2019年房屋委托租赁合同范本(通用版)!
2019/07/17 职场文书