• 博客园logo
  • 会员
  • 众包
  • 新闻
  • 博问
  • 闪存
  • 赞助商
  • HarmonyOS
  • Chat2DB
    • 搜索
      所有博客
    • 搜索
      当前博客
  • 写随笔 我的博客 短消息 简洁模式
    用户头像
    我的博客 我的园子 账号设置 会员中心 简洁模式 ... 退出登录
    注册 登录

gisoracle

  • 博客园
  • 联系
  • 订阅
  • 管理

公告

View Post

调用高德地图

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
    <title>设置地图显示内容</title>
    <link rel="stylesheet" href="http://cache.amap.com/lbs/static/main1119.css"/>
    <script type="text/javascript"
            src="http://webapi.amap.com/maps?v=1.4.0&key=299577313702646db4edcdde9b2a1fd0"></script>
    <script type="text/javascript" src="http://cache.amap.com/lbs/static/addToolbar.js"></script>
</head>
<body>
<div id="container" class="map" tabindex="0"></div>
<div  class='button-group' style="background-color: #0d9bf2">
    <input type='checkbox' onclick='refresh()' checked name='bg'>背景
    <input type='checkbox' onclick='refresh()' checked name='road'>道路
    <input type='checkbox' onclick='refresh()' checked name='building'>建筑物
    <input type='checkbox' onclick='refresh()' checked name='point'>标注
</div>
<script type="text/javascript">
    var map = new AMap.Map('container', {
        resizeEnable: true,
        zoom: 15,
        center: [102.408075, 24.950187]
    });
    function refresh() {
        var boxes = document.getElementsByTagName('input');
        var features = [];
        for (var i = 0; i < boxes.length; i += 1) {
            if (boxes[i].checked === true) {
                features.push(boxes[i].name);
            }
        }
        map.setFeatures(features);
    }
</script>
</body>
</html>

 

posted on 2017-10-06 17:08  gisai  阅读(126)  评论(0)    收藏  举报

刷新页面返回顶部
 
博客园  ©  2004-2025
浙公网安备 33010602011771号 浙ICP备2021040463号-3