jquery中国地图插件
插件下载地址:
http://www.17sucai.com/preview/1266961/2018-09-18/map/js/jsMap-1.1.0.min.js
jsMap
项目介绍
这是一个功能丰富的 jQuery 地图插件,采用 SVG 技术清晰的展示了中国地图,它拥有非常全面的参数接口,可以让开发者根据实际需求灵活配置。
网站地址:(http://jsmap.applinzi.com/)
兼容情况
兼容支持 SVG 的浏览器。
如何使用
- 引入 jQuery 文件;
- 引入 jsMap 文件;
- 通过 jsMap.config 配置地图即可。
程序 demo
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jsMap Demo</title>
<script src="jquery.min.js"></script>
<script src="jsMap.min.js"></script>
<script>
$(function () {
jsMap.config("#container", {
name: "china",
width: 900,
height: 500
});
})
</script>
</head>
<body> <div id="container"></div> </body>
</html>
参数属性
属性 | 说明 | 类型 | 默认值 |
---|---|---|---|
name | 地图名称,设置 china 则绘制中国地图,若要设置省份的地图,需要传入该省份的汉语全拼(注意:山西是 shanxi,陕西是 shaanxi) | String | china |
width | 地图容器的宽度 | Number | 800 |
height | 地图容器的高度 | Number | 500 |
strokeColor | 描边颜色 | String | #fff |
strokeWidth | 描边宽度 | Number | 1 |
fill | 填充颜色 | String / Object | #3f99f9 |
hoverFill | 鼠标悬浮时的填充颜色 | String / Object | #fff11c |
areaName | 是否显示地区名称,可选值 true / false | Boolean | false |
areaNameColor | 地区名称的文字颜色 | String | #000 |
hoverTip | 鼠标悬浮时的内容展示 | Boolean / Function | 当前地区名称 |
hoverCallback | 鼠标悬浮时的回调函数,参数分别是:id 和 name | Function | 空函数 |
clickCallback | 鼠标点击时的回调函数,参数分别是:id 和 name | Function | 空函数 |
clickHighLight | 鼠标点击时高亮颜色,true 则使用默认颜色,false 无高亮效果,String 自定义颜色 | Boolean / String | #dd2d01 |
jquery中国地图插件的更多相关文章
- 7款个性化jQuery/HTML5地图插件
现在我们经常会用到一些地图应用,无论是在网页上还是手机App中,地图貌似是一个不可或缺的应用.本文将带领大家一起来看看一些基于jQuery和HTML5的个性化地图插件,有几款地图比较实用,有些则是具有 ...
- 中国地图插件世界地图||jQuery矢量SVG地图插件JVectorMap
中国地图插件|jQuery矢量SVG地图插件JVectorMap https://www.html5tricks.com/jquery-china-map.html 世界地图: https://www ...
- PHP+jQuery中国地图热点数据统计展示实例
一款PHP+jQuery实现的中国地图热点数据统计展示实例,当鼠标滑动到地图指定省份区域,在弹出的提示框中显示对应省份的数据信息. 首先在页面中加一个div#tip,用来展示地图信息的提示框和#map ...
- Maplace.js – 小巧实用的 jQuery 谷歌地图插件
Maplace.js是一个小的显示谷歌地图的 jQuery 插件,帮助你把谷歌地图嵌入到你的网站,快速在地图位置上创建标记和控制菜单.它需要 jQuery 和谷歌地图 API v3 支持,所以这两个都 ...
- 20+ 个很有用的 jQuery 的 Google 地图插件
转自:http://www.oschina.net/translate/20-useful-jquery-google-maps-plugins Google 地图在寻找我们想要了解的商店或者其它有趣 ...
- 20+ 个很有用的 jQuery 的 Google 地图插件 (英语)
20+ 个很有用的 jQuery 的 Google 地图插件 (英语) 一.总结 一句话总结:英语提上来我才能快速去google上面找资源啊.google上面的资源要比百度丰富很多,然后有了英语就可以 ...
- jQuery地图插件jVectorMap的简单使用
1.官网下载jVectorMap插件压缩文件 官网地址:http://www.jvectormap.com/ 2.解压文件包括jVectorMap库及基础样式表,编写Html文件,引入jQuery框架 ...
- PHP+Mysql+jQuery实现中国地图区域数据统计(raphael.js)
使用过百度统计或者cnzz统计的童鞋应该知道,后台有一个地图统计,不同访问量的省份显示的颜色也不一样,今天我将带领大家开发一个这样的案例.上一篇<使用raphael.js绘制中国地图>文章 ...
- 网站开发中很有用的几个 jQuery 地图插件
下面提到的 jQuery 地图插件不仅仅是提供一个简便的方式来安装一个地图,如果你想在它们之间选择一个放到你的网站上,那么它们还有更多的额外选项来提供更多更全面的功能.大部分的 jQuery 地图插件 ...
随机推荐
- python sorted() count() set(list)-去重 -- search + match
2.用python实现统计一篇英文文章内每个单词的出现频率,并返回出现频率最高的前10个单词及其出现次数,并解答以下问题?(标点符号可忽略) (1) 创建文件对象f后,解释f的readlines和xr ...
- Mysql实现主从同步
根据网上众多参考案例,继续在VM虚拟机里实现MySQL主从同步功能.步骤如下: * 首先明确下环境 主库本地windows ip192.168.0.103 从库虚拟机mysql5.6 ip192.16 ...
- Java中的集合框架-Collection(一)
一,Collection接口 在日常的开发工作中,我们经常使用数组,但是数组是有很多的局限性的,比如:数组大小固定后不可修改,只能存储基本类型的值等等. 基于数组的这些局限性,Java框架就产生了用于 ...
- 《关于安卓和IOS开发》
28年前有人发明www microsoft技术开发人员lot 看论文可以看中国知网 微软亚洲研究院 WWDC苹果开发者大会上,苹果都会发布一些新的公司发展出的新的产品的新技术.iOS开发,用到的语言有 ...
- jquery toggleclass方法
给元素更改样式,一般使用 addClass() 和removeClass() jquery官方文档 对 addClass的介绍: Adds the specified class(es) to eac ...
- python 正则匹配手机号
import rephone = str(input('请输入手机号:'))# b = str(12345678912)t = re.compile(r'^1(3\d|4[4-9]|5[0-35-9] ...
- jquery 增加与删除数组元素
1.数组元素的添加 demoArray.push(value); var demo=new Array(); var key=[4,5]; demo.push(1);//插入数字 demo.push( ...
- php ajax confirm 删除
<button name="del" type="button" class="btn btn-primary btn-xs" id= ...
- Python学习手册之Python介绍、基本语法(一)
一.什么是python? python是一种高级的编程语言.它适合编写一些应用程序,比如:网站编程,脚本编程,科学计算和最近非常热门的AI(人工智能).目前,Google,腾讯,百度,阿里巴巴,豆瓣都 ...
- 编译Libuv
Libuv https://github.com/libuv/libuv LibSourcey是基于libuv,集合了第三方用于视频流的开源库,使用C++11. 下载最新 https://dist.l ...