zoukankan      html  css  js  c++  java
  • js调用百度地图API创建地图

    技术交流群: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=" 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>

  • 相关阅读:
    CSRF-防御与攻击
    windows 命令
    Integer.parseInt(String str, int i)
    springCloud springmvc 七牛云存储整合百度富文本编辑器
    jsp 文件
    标签的使用
    富文本编辑器
    项目总结 js
    namenode 和 datanode 节点
    Hadoop wordcount
  • 原文地址:https://www.cnblogs.com/cnndevelop/p/5287367.html
Copyright © 2011-2022 走看看