JQuery基于Svg矢量中国地图特效插件

JQuery基于Svg矢量中国地图特效插件

jQuery矢量地图插件利用svg属性制作中国城市各省份地图样式代码。

使用方法
在页面引入jquery.min.js、jsMap-1.1.0.min.js文件

1
2
<script src="js/jquery.min.js"></script>
<script src="js/jsMap-1.1.0.min.js"></script>

CSS样式

1
2
3
4
*{margin:0;padding:0;}
h1{text-align:center;font-weight:normal;font-size:34px;margin-top:40px;}
.container{width:1300px;height:1050px;margin:30px auto;}
.container>div{float:left;width:650px;height:500px;margin-bottom:25px;}

JS代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<script>
    jsMap.config("#container-01", {
        name: "china",
        width: 600,
        height: 400
    })
    jsMap.config("#container-02", {
        name: "china",
        width: 600,
        height: 400,
        areaName: true
    })
    jsMap.config("#container-03", {
        name: "china",
        width: 600,
        height: 400,
        fill: "#00C7B6"
    })
    jsMap.config("#container-04", {
        name: "china",
        width: 600,
        height: 400,
        fill: "#00C7B6",
        areaName: true
    })
</script>

文件信息:

    0

    发表评论