zoukankan      html  css  js  c++  java
  • ASP.NET MVC 中使用百度地图

       在使用百度地图之前,我们要先去百度开放平台申请ak。地址:http://lbsyun.baidu.com/

     填写开发者认证信息,你可以以个人名义,也可以以公司名义申请一个秘钥,企业开发者认证功能更加强大。在前期做技术开发,我们通常以个人名义申请一个秘钥,等以后项目要上线的时候切换到企业的秘钥就可以了(你也可以利用强大的百度找一些秘钥) 一般填写完认证信息之后,三五个工作日之内,就会审核,审核通过后,就可以去创建应用了。

    用百度地图生成器,去生成代码,地址:http://api.map.baidu.com/lbsapi/creatmap/index.html

    将生成的代码,直接复制粘贴到项目页面中就可以使用,但是生成的代码毕竟是生成的,你需要自己进行重构。

    你还可以去百度API示例中去寻找例子,然后进行修改,改造成你需要的样子。地址:http://developer.baidu.com/map/jsdemo.htm#c1_3

    下面是我做的一个简单的例子,你只要拷贝下来,然后把自己的秘钥填上就好了。

     1 @{
     2     Layout = null;
     3 }
     4 
     5 <!DOCTYPE html>
     6 <html>
     7 <head>
     8     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     9     <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    10     <style type="text/css">
    11         body, html, #allmap {
    12              100%;
    13             height: 100%;
    14             overflow: hidden;
    15             margin: 0;
    16             font-family: "微软雅黑";
    17         }
    18     </style>
    19     <title>异步加载地图</title>
    20 </head>
    21 <body>
    22     <div id="allmap"></div>
    23 </body>
    24 </html>
    25 <script type="text/javascript">
    26     //百度地图API功能
    27     function loadJScript() {
    28         var script = document.createElement("script");
    29         script.type = "text/javascript";
    30         script.src = "//api.map.baidu.com/api?v=3.0&ak=PlhFWpA02aoURjAOpnWcRGqw7AI8EEyO&callback=init";
    31         document.body.appendChild(script);
    32     }
    33     function init() {
    34         var map = new BMap.Map("allmap");            // 创建Map实例
    35         var point = new BMap.Point(116.404, 39.915); // 创建点坐标
    36         map.centerAndZoom(point,15);
    37         map.enableScrollWheelZoom();                 //启用滚轮放大缩小
    38     }
    39     window.onload = loadJScript;  //异步加载地图
    40 </script>
    41 
    42 <html>
    43 <head>
    44     <meta name="viewport" content="width=device-width" />
    45     <title>Map</title>
    46 </head>
    47 <body>
    48     <div>
    49     </div>
    50 </body>
    51 </html>
    View Code

    这实在是太简单了,没什么好讲的,只是有一点,大家在写代码的过程中,尽量做到不要重复你的代码,这是最最基本的原则。

    其实,使用一些第三方的API,真的很简单,你只需要先大概过一遍API文档,知道它能做什么,然后你需要哪方面的功能,就再专门细看一下这块的功能文档和示例,然后自己照着改就可以了。

  • 相关阅读:
    5.11实例应用
    VS2015调试
    4.4空间平滑
    4.3图像噪声
    4.2 傅里叶变换
    4.1 图像采样
    4.5.实例应用
    关于split和merge出错问题解决
    Ansible用于网络设备管理 part 3 使用NAPALM成品库
    记办公室小机房停电
  • 原文地址:https://www.cnblogs.com/qiao298/p/11576422.html
Copyright © 2011-2022 走看看