zoukankan      html  css  js  c++  java
  • 在项目中引用google地图

    首先去 http://code.google.com/intl/zh-CN/apis/maps/signup.html 

    我的网址中填入 你测试的页面 比如测试时 地址是  http://localhost:8080/mapTest

    点击生成密钥 页面上 不止有密钥 还有密钥的使用方法(生成之前必须要先用google帐号登录,如果没有帐号 点击生成跳转到注册页面) 

    在项目中假如一个测试页面 Google.jsp

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

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
     <head>
      <title>MyEclipse Google Maps Example</title>
      <meta http-equiv="pragma" content="no-cache">
      <meta http-equiv="cache-control" content="no-cache">
      <meta http-equiv="expires" content="0">

      <script type="text/javascript"

    //后面的key=这里就是生成的key  如果key不对 页面一片空白的
       src="http://www.google.com/jsapi?key=ABQIAAAAR_pdgDF_E-mJFQXMRJVOHRRP189eykzPrrAV7tRgT92eURxrGxSfti2JdFk9U2km8cMzgQmeW3b7Iw"></script>
      <script type="text/javascript">

      //加载地图到 id为maps的div中
         google.load("maps", "2");
         var map = null;
         var geocoder = null;
         google.setOnLoadCallback(function initmap() {
          map = new google.maps.Map2(document.getElementById("map"));
          geocoder = new google.maps.ClientGeocoder();
         });    
      </script>
      <script type="text/javascript" src="resources/map.js"></script>
     </head>
     <body>
      <h1>
       MyEclipse Google Maps Example
      </h1>
      
      <hr>
      <table>
       <tr>
        <td valign="top">
         <table>
          <tr>
           <td valign="top" align="left">
            Address:
            <br>
           </td>
           <td />
          </tr>
          <tr>
           <td valign="top" colspan="2">
            <form onsubmit="updateAddress(addrField.value); return false">
             <input type="text" id="addrField">
             <input type="submit" value="Find" />
            </form>
           </td>
          </tr>
          <tr>
           <td align="right">
            Latitude:
           </td>
           <td>
            <input type="text" id="latField" style=" 95px" />
           </td>
          </tr>
          <tr>
           <td align="right">
            Longitude:
           </td>
           <td valign="top">
            <input type="text" id="lngField" style=" 95px">
           </td>
          </tr>
         </table>
        </td>
        <td>


         <div id="map"
          style="border: blue 1px solid; 320px; height: 240px">
         </div>
        </td>
       </tr>
      </table>
     </body>
    </html>

  • 相关阅读:
    航空公司客户价值分析
    电力窃漏电用户自动识别
    信息论基础
    Xgboost
    直线或曲线拟合
    matplotlib中绘图
    pandas中绘图
    matplotlib图形设置
    子图subplot
    时间序列:时间序列理论、时间序列建模
  • 原文地址:https://www.cnblogs.com/liaomin416100569/p/9331445.html
Copyright © 2011-2022 走看看