0

我们如何在java中的浏览器上显示谷歌地图，我想为我的mysql数据库获取latlng，并使用这些latlng我想使用java（jsp / servlet）代码显示每个点的气泡图像。我正在使用它的html代码.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>

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



<script type="text/javascript">


var stations = [[1, 'cbkStn2001', 'Kukatpally', '5000', 17.494207, 78.384724],[1, 'cbkStn1001', 'Kuntapalanahalli', '50', 14.3543, 75.9266],[1, 'cbkStn1', 'Turchugutta2', '340', 17.494207, 78.3844657]];



var stations[]=


alert(stations);

  function initializeMap() {
      if(stations.length >= 1){
        var pointLatlng = new google.maps.LatLng(stations[0][4] , stations[0][5]);
      }else{
          var pointLatlng = new google.maps.LatLng(-25.363882,131.044922);
      }

    var myOptions = {
      zoom: 5,
      center: pointLatlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }

    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);



    for(var i=0; i <stations.length; i++){
        if(stations[i][0] == 1){

            pointLatlng = new google.maps.LatLng(stations[i][4] , stations[i][5]);

            setMarker(map, pointLatlng, "<h1>"+stations[i][2]+"</h1>"+"Voters = "+stations[i][3] );
        }
    }




  }

  function setMarker(map, latlng, content){

      var infowindow = new google.maps.InfoWindow({
            content: content
        });

        var marker = new google.maps.Marker({
            position: latlng,
            map: map,
            //title: 'Uluru (Ayers Rock)'
        });
        google.maps.event.addListener(marker, 'click', function() {
          infowindow.open(map,marker);
        });
  }

  function checkBoxChange(elementId){

    for(var i=0; i < stations.length; i++){
        if(stations[i][1] == elementId){

            if(document.getElementById(elementId).checked == true){
                stations[i][0] = 1;
                initializeMap();
            }else{
                stations[i][0] = 0;
                initializeMap();
            }                       
            break;
        }
    }

  }
</script>

</head>
<body onload="initializeMap()">
    <table width="700" cellpadding="0" cellspacing="0" border="0">
        <tr>
            <td colspan="2"><h1>Prototype Map</h1></td>
        </tr>
        <tr>
            <td width="200" align="left" valign="top">
            <h3>Poling Stations</h3>

                    <input type="checkbox" id="cbkStn2001" onchange="checkBoxChange('cbkStn2001')" checked="checked" /> Kukatpally <br />

                    <input type="checkbox" id="cbkStn1001" onchange="checkBoxChange('cbkStn1001')" checked="checked" /> Kuntapalanahalli <br />

                    <input type="checkbox" id="cbkStn1" onchange="checkBoxChange('cbkStn1')" checked="checked" /> Turchugutta2 <br />



            </td>
            <td width="500" align="left" valign="top"><div id="map_canvas" style="width: 500px; height: 500px;"></div></td>
        </tr>
    </table>
</body>
</html>

如果有人有请帮忙的意思

4

1 回答 1

0

看看 OpenLayers。它将允许您在 Web 应用程序中嵌入地图。

于 2012-08-30T09:39:51.067 回答