后退 刷新 前进 收藏 顶部 |   知道 黑匣子 富媒体 技术服务

网站建设之(GOOGLE地图的调用)实用调用方法:JQUERY + maplace

程序猿 JS GOOGLE地图 坐标 JQUERY MAPLACE... (shuke.2014-05-03 11:22)
Maplace.js帮助你将google地图嵌入到你的网站,当然要知道你的地理坐标;
可以在地图上快速创建标记和控制菜单的位置。
他的运行需要jQuery和google maps api v3。
因为JS 使用的比较多,集成一个maplace.sk.min.js(18.1K);
官方地址:http://maplacejs.com/
代码:
<style>
* {
        margin:0;
        padding:0
}
body {
        margin:0 auto;
}
#skmap {
        margin:10px auto;
        width:700px;
        height:700px;
        overflow:hidden;
        background:#efefef;
}
#skmap dt.sktitle{font-size:12px;line-height:30px;padding:0 30px}
#skmap #gmap {
        width:100%;
        height:100%;
}
</style>
</head>
<body>
<dl id="skmap">
<dt class="sktitle">地图页面:http://ditu.google.cn/<br>
选择:Google 地图实验室<br>
查看经纬度:百慕大群岛,32.327467,-64.834156<br>
zoom:缩放比例;<input type="button" value="查看 百慕大群岛 地图" id="skb"></dt>
<dd id="gmap"></dd>
</dl>

</body>
</HTML>
<script style="text/javascript" src="maplace.sk.min.js"></script>
<script style="text/javascript">
$(document).ready(function() {
$("#skb").click(function(){
new Maplace({ locations: [{ lat:32.327467, lon: -64.834156, title: '百慕大群岛', html: "百慕大群岛<br>2014/5/3<br> power by shuke", zoom: 12 }] }).Load();
});
});

</script>


进度:100% 返回程序猿

解决织梦图集中上传图片时跳出302错误

图片新热点

导航


目录


    站内搜索
    首页 | W3C | ME