2014-04-20 6 views
0

Java EE를 사용하여 웹 응용 프로그램을 작성 중이며 데이터베이스의 좌표가있는 JSP 페이지에 배치 된 Google지도에 마커를 동적으로 추가하고 싶습니다. 나는 다음과 같은 코드를 가지고,하지만 난 출력 배열 만 2 필드가Google지도 및 마커, JSP

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

제대로이 부분을 이해한다면 나는 문제

<%@ 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 만? 인덱스가 잘못된 것보다 필드가 두 개만있는 경우 : 마커 [i] [0], 마커 [i] [1])를 사용해야합니다. 그렇지 않으면'initialize()'함수가 정상이다. –

+0

새 사용자에게 스택 오버플로에 오신 것을 환영합니다. 관련 부분에 대해서만 코드를 포함 시키십시오. 예를 들어, 문제와 관련이 없으므로 CSS 코드를 제거하십시오. 이렇게하면 더 나은 답변을 더 빨리 제공 할 수 있습니다. –

답변

0

을 정확히 파악할 수 없습니다. LatLng를 만드는 데 사용되는 경우 인덱스에서 잘못하고 0과 1을 사용하도록 변경해야합니다

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

그렇지 않으면, 당신은 또한 정보창 콘텐츠에 대한 정보를 포함해야합니다.

+0

당신의 도움을 위해 thx, 나는 이미 그것을 변경했지만 "java.lang.ClassNotFoundException : 이클립스에서 com.mysql.jdbc.Driver"라는 다른 문제가있다. MySQL 연결을 위해 jar 파일을 포함시킨 후에도 그렇다. – souzanne