如何在jstl + javascript中使用foreach？

Question

我嘗試在Google地圖中添加圖釘。 我收集${list}包含坐標和名稱的${list}項目。 我要放在地圖上的每個人物品。 我寫一些代碼：

<script>
function initMap() {
<c:forEach items="${list}" var="item">
    var cairo = {lat: ${item.geometry.lat}, lng: ${item.geometry.lng}};
    var map = new google.maps.Map(document.getElementById('map'), {
        scaleControl: true,
        center: cairo,
        zoom: 10
    });
    var infowindow = new google.maps.InfoWindow;
    infowindow.setContent('${item.name}');
</c:forEach>
}

但是我的代碼無法正常工作。 這樣只會在地圖中添加集合中的一個（最后一個）項目。

請幫忙。

Answer 1

您可能需要創建一個標記點才能映射

function initMap() {

var cairo =new google.maps.LatLng(38.54,77.02); 

var map = new google.maps.Map(document.getElementById('map'), {
    scaleControl: true,
    center: cairo,
    zoom: 10
});

<c:forEach items="${list}" var="item">

var infowindow = new google.maps.InfoWindow;

infowindow.setContent('${item.name}');

var myLatlng = new google.maps.LatLng(${item.geometry.lat}, ${item.geometry.lng});

 var marker = new google.maps.Marker({
    position : myLatlng,
    map : map,
    icon : 'img/icon.png' 
    title:${item.name}
   }); 
   google.maps.event.addListener(marker, 'click', function() {  
    // map.setZoom(15);  
    // map.setCenter(marker.getPosition());  
     infowindow.open(map, marker);  
    });  
  </c:forEach>

 }

Answer 2

我用這種方式，它的工作原理。 希望對您有所幫助。

 <script type="text/javascript">
    /* Markers information
       KONUME & KONUMB = latLng & numbers in database
       numbers can be left unquoted. */
    var markers = [
       <c:forEach var="row" items="${result.rows}">
                   ['<c:out value="${row.aciklama}" />',
                     <c:out value="${row.KONUME}" />,
                     <c:out value="${row.KONUMB}" />,
                     <c:out value="${row.EVID}" />,
                    '<c:out value="${row.aptadi}" />',
                    '<c:out value="${row.mahalle}" />',
                    '<c:out value="${row.sokak}" />',
                    '<c:out value="${row.durumu}" />',
                    '<c:out value="${row.metrekare}" />',
                    '<c:out value="${row.fiyat}" />',
                    '<c:out value="${row.odasayisi}" />'],
        </c:forEach>   ];  

     var map;
     /*<body onload="initialize()">*/
     function initialize() {

        var latlng= new google.maps.LatLng(38.675124,39.217375);

        var mapOptions = {
          center: latlng,
          zoom: 15,
          mapTypeId: google.maps.MapTypeId.HYBRID
        };
        map = new google.maps.Map(document.getElementById('map_canvas'),
            mapOptions);
        for( i = 0; i < markers.length; i++ ) {
           var position = new google.maps.LatLng(markers[i][1],markers[i][2]);

           marker = new google.maps.Marker({
           position: position,
           map: map,
           title: markers[i][0],
           icon:image
        });
     }
</script>

我的項目

JSP + Google Maps API

JSP + Angular + Google Maps API

很簡單，是嗎？ 請注意，您仍然需要在變量周圍使用單引號。 不是Java / JSP，而是JavaScript！ 僅純數字或布爾變量可以不加引號。

另請參閱Java / JSP / JSF和JavaScript

如何在jstl + javascript中使用foreach？

問題描述

2 個解決方案

解決方案1
0 2016-01-17 03:53:24

解決方案2
0 2016-01-17 10:41:17

如何在jstl + javascript中使用foreach？

問題描述

2 個解決方案

解決方案1 0 2016-01-17 03:53:24

解決方案2 0 2016-01-17 10:41:17

解決方案1
0 2016-01-17 03:53:24

解決方案2
0 2016-01-17 10:41:17