zoukankan      html  css  js  c++  java
  • 百度地图api应用

    步骤一:搜索百度地图api

    步骤二:注册秘钥

    步骤三:demo拷贝,用地图生成器生成坐标

    再根据api实现其他功能

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>map</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
        <style>
            body, html, #map {
                width: 100%;
                height: 100%;
                overflow: hidden;
                margin: 0;
                font-family: "微软雅黑";
            }
        </style>
        <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=你的秘钥"></script>
    </head>
    <body>
    <div id="map">
    
    </div>
    <script type="text/javascript">
        // 百度地图API功能
        var map = new BMap.Map("map");
        var point = new BMap.Point(121.480524,31.23595);
        map.centerAndZoom(point,12);
        // 创建地址解析器实例
        var myGeo = new BMap.Geocoder();
        // 将地址解析结果显示在地图上,并调整地图视野
    //    myGeo.getPoint("北京市海淀区上地10街", function(point){
    //        if (point) {
    //            map.centerAndZoom(point, 16);
    //            map.addOverlay(new BMap.Marker(point));
    //        }else{
    //            alert("您选择地址没有解析到结果!");
    //        }
    //    }, "北京市");
        map.enableScrollWheelZoom();   //启用滚轮放大缩小,默认禁用
        map.enableContinuousZoom();    //启用地图惯性拖拽,默认禁用
    </script>
    </body>
    </html>
    View Code
  • 相关阅读:
    html语法规范
    html页面基本结构
    HTML头部结构详解
    文件路径中 / 和 ./ 和 ../的区别
    实体符号
    利用JS修改style属性和添加元素类名(important)
    Less
    Eureka自我保护计算
    Eureka元数据
    EurekaServer源码分析
  • 原文地址:https://www.cnblogs.com/QIQIZAIXIAN/p/6945928.html
Copyright © 2011-2022 走看看