技术交流群：233513714

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
  <title></title>
    <script type="text/javascript" src="http://api.map.baidu.com/api?&v=1.3">
    </script>
</head>
<body>
    <p>
        地址：<input id="txtSearch" type="text" />
        <input type="button" value="搜索" onclick="search()" /></p>
    <div style="width: 800px; height: 600px; border: 1px solid gray;" id="container">
    </div>
</body>
<script type="text/javascript">
    function $(id) {
        return document.getElementById(id); //定义$
    }
    var map = new BMap.Map("container"); //创建地图
    map.centerAndZoom(new BMap.Point(116.330599, 39.95536), 10); //初始化地图

map.enableScrollWheelZoom();  // 开启鼠标滚轮缩放    
    map.enableKeyboard();         // 开启键盘控制    
    map.enableContinuousZoom();   // 开启连续缩放效果    
    map.enableInertialDragging(); // 开启惯性拖拽效果

map.addControl(new BMap.NavigationControl()); //添加标准地图控件(左上角的放大缩小左右拖拽控件)  
    map.addControl(new BMap.ScaleControl());      //添加比例尺控件(左下角显示的比例尺控件)  
    map.addControl(new BMap.OverviewMapControl()); // 缩略图控件  
    map.addControl(new BMap.MapTypeControl());

var city = new BMap.LocalSearch(map, { renderOptions: { map: map, autoViewport: true} }); //地图显示到查询结果处

function search() {
        var s = $("txtSearch").value;
        city.search(s); //查找城市
    }
</script>
</html>

js调用百度地图API创建地图的更多相关文章

  1. js调用百度地图API创建地图，搜索位置

    实现代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <met ...

  2. HTML5结合百度地图API创建地图应用

    具体的百度地图API的使用方法查看百度地图API里的DEMO <style> #div1{ width:400px; height:400px; border:1px #000 solid ...

  3. Node.js调用百度地图Web服务API的Geocoding接口进行点位反地理信息编码

    (从我的新浪博客上搬来的,做了一些修改.) 最近迷上了node.js以及JavaScript.现在接到一个活,要解析一个出租车点位数据的地理信息.于是就想到使用Node.js调用百度地图API进行解析 ...

  4. js调用百度地图接口

    原文:js调用百度地图接口 这是前几天公司做的新项目,上面需要用到地图的数据.第一次做这类型的东西没啥思路,咱们经理说,这东西简单,截个图存文件夹里调整好尺寸,数据库里存上图片的地址动态调用就行了.心 ...

  5. 关于百度地图API的地图坐标转换问题

    原文:关于百度地图API的地图坐标转换问题 我在之前的文章利用html5获取经纬度并且在百度地图中显示位置中使用了百度地图的API来显示html5获取的地理位置,在文中我说过这样的话,我说百度地图的准 ...

  6. 百度地图API自定义地图

    http://api.map.baidu.com/lbsapi/creatmap/index.html http://developer.baidu.com/map/index.php?title=w ...

  7. 网页嵌入百度地图和使用百度地图api自定义地图的详细步骤

    在网页中插入百度地图 如果想在自己的网页上面加入百度地图的话,可以用百度地图的api.具体使用方法如下: 第一步:进入百度创建地图的网站http://api.map.baidu.com/lbsapi/ ...

  8. 原生js简单调用百度翻译API实现的翻译工具

    先来个在线demo: js翻译工具 或者百度搜索js简单调用百度翻译API工具(不过有个小小的界面显示bug,我想细心的人应该会发现) 或者直接前往该网址:js翻译工具 或者前往我的github:gi ...

  9. Python 调用百度翻译API

    由于实习公司这边做的是日文app,有时要看看用户反馈,对于我这种五十音图都没记住的人,表示百度翻译确实还可以.但不想每次都复制粘贴啊,google被墙也是挺蛋疼的事,所以用python结合baidu ...

随机推荐

  1. URAL 1306 Sequence Median（优先队列）

    题意:求一串数字里的中位数.内存为1M.每个数范围是0到2的31次方-1. 思路:很容易想到把数字全部读入,然后排序,但是会超内存.用计数排序但是数又太大.由于我们只需要第n/2.n/2+1大(n为偶 ...

  2. tip use view.isineditmode() in your custom views to skip code when shown in eclipse

    tip use view.isineditmode() in your custom views to skip code when shown in eclipse

  3. C++11 实现 argsort

    看python发现有这么个api,感觉很实用,想着stl里会不会有这个呢?查了半天毫无结果.于是用lambda自己实现了下. 以vector为例 template<typename T> ...

  4. HDOJ-三部曲-1002-Radar Installation

    Radar Installation Time Limit : 2000/1000ms (Java/Other)   Memory Limit : 20000/10000K (Java/Other) ...

  5. 转：SSL协议详解

    http://kb.cnblogs.com/page/162080/ 背景介绍    最近在看<密码学与网络安全>相关的书籍,这篇文章主要详细介绍一下著名的网络安全协议SSL. 在开始SS ...

  6. nginx模块_使用gdb调试nginx源码

    工欲善其事必先利其器,如何使用调试工具gdb一步步调试nginx是了解nginx的重要手段. ps:本文的目标人群是像我这样初接触Unix编程的同学,如果有什么地方错误请指正. 熟悉gdb的使用 这里 ...

  7. nginx的upstream目前支持5种方式的分配(转)

    nginx的upstream目前支持5种方式的分配 1.轮询(默认) 每个请求按时间顺序逐一分配到不同的后端服务器,如果后端服务器down掉,能自动剔除. 2.weight 指定轮询几率,weight ...

  8. 【题解】【数组】【查找】【Leetcode】Search Insert Position

    Given a sorted array and a target value, return the index if the target is found. If not, return the ...

  9. 机器学习技法-随机森林（Random Forest）

    课程地址:https://class.coursera.org/ntumltwo-002/lecture 重要!重要!重要~ 一.随机森林(RF) 1.RF介绍 RF通过Bagging的方式将许多个C ...

  10. js缓速运动

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...