基于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 相关文章推荐
执行iframe中的javascript方法
Oct 07 Javascript
Jquery工作常用实例 使用AJAX使网页进行异步更新
Jul 26 Javascript
javascript显示用户停留时间的简单实例
Aug 05 Javascript
jquery.ui.draggable中文文档(原文翻译)
Nov 15 Javascript
jQuery异步验证用户名是否存在示例代码
May 21 Javascript
JS实现很酷的水波文字特效实例
Feb 26 Javascript
jqueryMobile使用示例分享
Jan 12 Javascript
jquery easyui datagrid实现增加,修改,删除方法总结
May 25 Javascript
3kb jQuery代码搞定各种树形选择的实现方法
Jun 10 Javascript
Chart.js 轻量级HTML5图表绘制工具库(知识整理)
May 22 Javascript
p5.js实现故宫橘猫赏秋图动画
Oct 23 Javascript
Echarts在Taro微信小程序开发中的踩坑记录
Nov 09 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生成16位随机数的代码(两种方法)
2014/09/16 PHP
使用jquery插件实现图片延迟加载技术详细说明
2011/03/12 Javascript
基于MVC3方式实现下拉列表联动(JQuery)
2013/09/02 Javascript
JQuery中使用.each()遍历元素学习笔记
2014/11/08 Javascript
javascript实现确定和取消提示框效果
2015/07/10 Javascript
使用JS实现图片展示瀑布流效果的实例代码
2016/09/12 Javascript
微信小程序(应用号)开发新闻客户端实例
2016/10/24 Javascript
JS中检测数据类型的几种方式及优缺点小结
2016/12/12 Javascript
js实现截图保存图片功能的代码示例
2017/02/16 Javascript
用node和express连接mysql实现登录注册的实现代码
2017/07/05 Javascript
如何编写一个完整的Angular4 FormText 组件
2017/11/18 Javascript
详解tween.js 中文使用指南
2018/01/05 Javascript
JS数组去重常用方法实例小结【4种方法】
2018/05/28 Javascript
vue2.0中set添加属性后视图不能更新的解决办法
2019/02/22 Javascript
微信小程序视图控件与bindtap之间的问题的解决
2019/04/08 Javascript
JS用最简单的方法实现四舍五入
2019/08/27 Javascript
vue 解决数组赋值无法渲染在页面的问题
2019/10/28 Javascript
[56:46]Liquid vs IG 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/18 DOTA
python批量生成本地ip地址的方法
2015/03/23 Python
python获取指定路径下所有指定后缀文件的方法
2015/05/26 Python
Python信息抽取之乱码解决办法
2017/06/29 Python
python 如何将数据写入本地txt文本文件的实现方法
2019/09/11 Python
canvas像素画板的实现代码
2018/11/21 HTML / CSS
骆驼官方商城:CAMEL
2016/11/22 全球购物
Cotton On香港网站:澳洲时装连锁品牌
2018/11/01 全球购物
澳大利亚珠宝商:Shiels
2019/10/06 全球购物
就业协议书的作用
2014/04/11 职场文书
工伤事故赔偿协议书范文
2014/09/24 职场文书
2015羊年春节慰问信
2015/02/14 职场文书
工程资料员岗位职责
2015/04/13 职场文书
中秋节晚会开场白
2015/05/29 职场文书
建党伟业观后感
2015/06/01 职场文书
2015中学教师个人工作总结
2015/07/22 职场文书
幼儿园开学家长寄语(2016秋季)
2015/12/03 职场文书
营销策划分析:怎么策划才能更好销量产品?
2019/09/04 职场文书
mysql字段为NULL索引是否会失效实例详解
2022/05/30 MySQL