解决方案 »

  1.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head>
    <title>设置城市demo</title>
    <meta http-equiv="Content-Type" content="text/html; charset=gbk" />
    <script type="text/javascript" src="http://api.map.baidu.com/api?key=79d13dd2c1076b1ad827484228ee4dea&v=1.1&services=true" ></script>
    </head>
    <body>
    <input type="text" id="cityName" />
    <input type="button" onclick="setCity()" value="设置" />
    <div id="container" style="width:500px;height:400px"></div>
    <script>
    var map = new BMap.Map("container");
    map.addControl(new BMap.NavigationControl());
    map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);var search = new BMap.LocalSearch("中国", {
      onSearchComplete: function(result){
        if (search.getStatus() == BMAP_STATUS_SUCCESS){
          var res = result.getPoi(0);
          var point = res.point;
          map.centerAndZoom(point, 11);
        }
      },renderOptions: {  //结果呈现设置,
        map: map,  
        autoViewport: true,  
        selectFirstResult: true 
      } ,onInfoHtmlSet:function(poi,html){//标注气泡内容创建后的回调函数,有了这个,可以简单的改一下返回的html内容了。
         alert(html.innerHTML)
      }//这一段可以不要,只不过是为学习更深层次应用而加入的。
    });function setCity(){
      search.search(document.getElementById("cityName").value);
      alert(document.getElementById("cityName").value);
    }
    </script>
    </body>
    </html>
      

  2.   

    这个复制粘贴看看吧!<!DOCTYPE>
    <html>
    <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <meta http-equiv="Content-Type" content="text/html; charset=gbk" />
    <title>百度地图</title>
    <style type="text/css">
    html{height:100%}
    body{height:100%;margin:0px;padding:0px}
    #container{height:100%}
    </style>
    <script src="http://api.map.baidu.com/api?v=1.4" type="text/javascript"></script>
    </head>
    <body>
    <input type="text" id="cityName" value="福州"/>
    <input type="button" onclick="setCity()" value="查找" />
    <div id="container" style="width:1024px;height:600px;"></div>
    <script type="text/javascript">
    var map = new BMap.Map("container"); //在container容器中创建一个地图,参数container为div的id属性; var point = new BMap.Point(120.2,30.25); //创建点坐标
    map.centerAndZoom(point, 14); //初始化地图,设置中心点坐标和地图级别
    map.enableScrollWheelZoom(); //激活滚轮调整大小功能
    map.addControl(new BMap.NavigationControl()); //添加控件:缩放地图的控件,默认在左上角;
    map.addControl(new BMap.MapTypeControl()); //添加控件:地图类型控件,默认在右上方;
    map.addControl(new BMap.ScaleControl()); //添加控件:地图显示比例的控件,默认在左下方;
    map.addControl(new BMap.OverviewMapControl());  //添加控件:地图的缩略图的控件,默认在右下方; TrafficControl     var search = new BMap.LocalSearch("中国", {
      onSearchComplete: function(result){
    if (search.getStatus() == BMAP_STATUS_SUCCESS){
      var res = result.getPoi(0);
      var point = res.point;
      map.centerAndZoom(point, 11);
    }
      },renderOptions: {  //结果呈现设置,
    map: map,  
    autoViewport: true,  
    selectFirstResult: true 
      } ,onInfoHtmlSet:function(poi,html){//标注气泡内容创建后的回调函数,有了这个,可以简单的改一下返回的html内容了。
    // alert(html.innerHTML)
      }//这一段可以不要,只不过是为学习更深层次应用而加入的。
    }); function setCity(){
      search.search(document.getElementById("cityName").value);
    } search.search(document.getElementById("cityName").value);
    </script>
    </body>
    </html>
      

  3.   

    直接使用  百度在线的api就行,不过要有网络才能用的,,,,
      

  4.   

    百度有地图的API,自己熟悉下嵌进去,注册key不然老弹窗。