2014-04-20 190 views
0

我正在使用Java EE處理Web應用程序,我想動態地將標記添加到放置在我的JSP頁面上的Google地圖中,並使用我的數據庫中的座標。我有以下的代碼,但如果我理解正確的這部分Google地圖和標記,JSP

var markers = [ 
      <c:forEach var="s" items="${list.rows}"> 
[<c:out value="${s.latitude}"/>,<c:out value="${s.longitude}"/>] 
     </c:forEach> 

只有2個輸出數組中的字段,我不能確定問題

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" 
pageEncoding="ISO-8859-1"%> 
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> 
<%@ taglib uri="http://java.sun.com/jsp/jstl/sql" prefix="sql" %> 

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
<style type="text/css"> 
    html, body{ 
height:100%; 
margin: 0; 
padding: 0; 
    } 
    #map_canvas{ 
height:700px; 
width: 700px; 
    } 
    #map-canvas { height: 100% } 
    </style> 
    <sql:setDataSource var="enterdata" 
      driver="com.mysql.jdbc.Driver" 
      user="root" password="root" 
      url="jdbc:mysql://localhost/google_maps" /> 


     <script type="text/javascript" src="http://maps.google.com/maps/api/js?   sensor=false"></script> 


     <script type="text/javascript"> 


     var markers = [ 
      <c:forEach var="s" items="${list.rows}"> 
[<c:out value="${s.latitude}"/>,<c:out value="${s.longitude}"/>] 
     </c:forEach>  ]; 




function initialize(){ 
    var latlng = new google.maps.LatLng(markers[0][1],markers[0][2]); 
    var mapOptions={ 
     zoom: 6, // 0 à 21 
     center: new google.maps.LatLng(36,5), // centre de la carte 
     mapTypeId: google.maps.MapTypeId.ROADMAP, // ROADMAP, SATELLITE, HYBRID, TERRAIN 
    } 

    var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); 
    var infowindow = new google.maps.InfoWindow(), marker, i; 

    for (i = 0; i < markers.length; i++) { 
     marker = new google.maps.Marker({ 
      position: new google.maps.LatLng(markers[i][1], markers[i][2]), 
      map: map 
     }); 


     google.maps.event.addListener(marker, 'click', (function(marker, i) { 
      return function() { 
       infowindow.setContent(markers[i][0]); 
       infowindow.open(map, marker); 
      } 
     })(marker, i)); 

    } 
} 
    google.maps.event.addDomListener(window, 'load', initialize); 
    </script> 
    </head> 
    <body onload="initialize()"> 
    <div id="map_canvas"></div> 
    <sql:query var = "users" dataSource="${dataSource}"> 
      select longitude,latitude from map 
      </sql:query> 
    <p class="info">${ message }</p> 
    </body> 
     </html> 
+0

您在輸出中有多少個字段? 3還是隻有2?如果只有兩個字段的索引是錯誤的:marker [i] [0],markers [i] [1])應該被使用。否則,'initialize()'函數可以。 –

+0

歡迎使用Stack Overflow新用戶,請嘗試將代碼僅包含到相關部分(例如,刪除CSS代碼,因爲它不太可能與問題相關)。這將幫助我們爲您更快地提供更好的答案。 –

回答

0

。在用於創建LatLng這種情況下,指標是錯誤的,應改爲使用0和1:

position: new google.maps.LatLng(markers[i][0], markers[i][1]), 

否則,你將不得不還包括對信息窗口內容的信息。

+0

thx爲你的幫助,我已經改變了,但我有一個其他問題,即「在Eclipse中的java.lang.ClassNotFoundException:com.mysql.jdbc.Driver」,即使我已經包含用於連接mysql的jar文件 – souzanne