2012-08-30 92 views
0

我们怎样才能在浏览器中显示谷歌地图在Java中,我想获得我的MySQL数据库latlng,并使用这些latlng我想显示每个点使用java(jsp/servlet)code.i使用html代码的气泡图像为了它。如何使用java在浏览器上显示谷歌地图?

<!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> 

如果任何一个有请帮忙的意思

+3

[你有什么尝试?](http://www.whathaveyoutried.com/)我的意思是*除了*在互联网上随机的陌生人问为你做。 –

+2

@AndrewThompson在过去的三个月里,看到很多问题,我得出结论:SO应该有以下增加:在每个问题下,应该有三个按钮(对于> x代表用户)“您尝试过什么? “,”格式化你的代码!“和“SSCCE!”,它应该会自动产生一个像你这样的评论......(或者赞成已有的类似评论) – brimborium

+0

@brimborium最好的主意我整天听到了.. :) –

回答

0

看看的OpenLayers。它可以让你在你的web应用程序中嵌入地图。

相关问题