zoukankan      html  css  js  c++  java
  • 一个简单的地图实现

    创建一个地图的步骤:

     1、HTML生命为<!DOCTYPE >

    2、引入百度的jjs的ap:<script type="text/javascript" src="http://api.map.baidu.com/api?key=79d13dd2c1076b1ad827484228ee4dea&v=1.1&services=true" ></script>

    3、声明地图在哪个id下(不设置大小不显示):

    <style type="text/css">
    #container{
    height:500px;
    width: 500px;
    }
    </style>
    View Code

    4、在body中写一个div,id为上述的id名称。

    5、在div之外,写一个js代码:

    1 var map = new BMap.Map("id名称");//创建一个放置地图的容器
    2 var point = new BMap.Point(116.404, 39.915)//定位
    3 map.centerAndZoom(point,11);//11位地图显示级别

    完整的代码:

     1 <!DOCTYPE >
     2 <html>
     3 
     4     <head>
     5         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
     6         <title>地图初级</title>
     7         <script type="text/javascript" src="http://api.map.baidu.com/api?key=79d13dd2c1076b1ad827484228ee4dea&v=1.1&services=true"></script>
     8         <style type="text/css">
     9             #container {
    10                 height: 500px;
    11                 width: 500px;
    12             }
    13         </style>
    14     </head>
    15 
    16     <body>
    17         <div id="container"></div>
    18         <script type="text/javascript">
    19             /*
    20              * 在container容器中创建一个地图,参数container为div的id属性
    21              */
    22             var map = new BMap.Map("container");
    23             /**
    24              * 定位
    25              */
    26             var point = new BMap.Point(116.404, 39.915);
    27             /**
    28              * 将point移动到浏览器中心,并且地图级别调整为15;
    29              */
    30             map.centerAndZoom(point, 11);
    31         </script>
    32     </body>
    33 
    34 </html>
  • 相关阅读:
    Java IO 之 RandomAccessFile 操作文件内容
    Java IO 之 FileFilter与FilenameFilter
    Java IO 之 File 的创建、重命名与遍历
    Java IO 之 System类
    JVM内存区域配置
    切换 显示与隐藏页面元素
    thead tfoot tbody标签的使用
    使用锚点在HTML页面中快速移动
    ASP.NET Core 项目归档
    检测到有潜在危险的 Request.Form 值 转
  • 原文地址:https://www.cnblogs.com/swfzzz/p/8424449.html
Copyright © 2011-2022 走看看