zoukankan      html  css  js  c++  java
  • jsp页面中显示地图

    在一个jsp页面中贴上以下代码即可成功显示出百度地图;

    <%@ page language="java" contentType="text/html; charset=UTF-8"  pageEncoding="UTF-8"%>

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

    <html>

    <head>

    <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.4"></script>

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <title>textMap</title>

    </head>

    <body>

     <form action="" method="get">   

    <label>地点:</label> <input id="where" name="where" type="text">   

    <input type="button" value="地图上找"    onClick="sear(document.getElementById('where').value);" /> <br />   

    <div style=" 520px; height: 340px; border: 1px solid gray"    id="container"></div>   <br />

    经纬度: <input id="lonlat" name="lonlat" type="text">  

    </form>

     <script type="text/javascript">   

    var map = new BMap.Map("container");//在指定的容器内创建地图实例  

     map.setDefaultCursor("crosshair");//设置地图默认的鼠标指针样式   

    map.enableScrollWheelZoom();//启用滚轮放大缩小,默认禁用。   

    map.centerAndZoom(new BMap.Point(116.124878, 24.309178), 13);   

    map.addControl(new BMap.NavigationControl());   

    map.addEventListener("click", function(e) {//地图单击事件    

    document.getElementById("lonlat").value = e.point.lng + ", "      + e.point.lat;   });   function iploac(result) {//根据IP设置地图中心    

    var cityName = result.name;   

     map.setCenter(cityName);   }   

    var myCity = new BMap.LocalCity();   

    myCity.get(iploac);   

    function sear(result) {//地图搜索    

    var local = new BMap.LocalSearch(map,

    {     renderOptions : {      map : map     }    });    local.search(result);   }  

    </script>

    </body>

    </html>

  • 相关阅读:
    servlet的监听器、过滤器、拦截器的区别
    根据一个单词找所有的兄弟单词的思想如何处理
    Maven deploy 部署 jar 到 Nexus 私服
    在vps上搭建hexo博客
    Java解决LeetCode72题 Edit Distance
    学以致用:Python爬取廖大Python教程制作pdf
    puppeteer截图
    Netty接收HTTP文件上传及文件下载
    Docker中执行Shell出现乱码
    Netty URL路由方案探讨
  • 原文地址:https://www.cnblogs.com/baorantHome/p/8066860.html
Copyright © 2011-2022 走看看