как использовать Google Map Api в JSP?

Question

как использовать Google Map Api в JSP?

Я следую примеру кода с веб-страницы Google Map API, которая использует JavaScript и HTML. Пример HTML работает нормально, но использование JavaScript source в JSP для создания карт Google не работает.

  <%@ page language="java" contentType="text/html; charset=EUC-KR"

    pageEncoding="EUC-KR"%>

<!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=EUC-KR">

<title>Insert title here</title>

</head>

<body>

<script

    src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>

<script>

var map;

function initialize() {

  var mapOptions = {

    zoom: 8,

    center: new google.maps.LatLng(-34.397, 150.644)

  };

  map = new google.maps.Map(document.getElementById('map-canvas'),

      mapOptions);

}



google.maps.event.addDomListener(window, 'load', initialize);

</script>

</body>

</html>

Это из их документации. Как использовать Google Api v3 в JSP Source?

578 1

javascript google-maps google-maps-api-3 jsp

1 ответ:

Comments

Ничего не найдено.

jsjunkie · Accepted Answer · 2013-11-20 16:16:21

Если код, который вы разместили выше, относится к jsp, о котором вы говорите, то вы пропустили добавление div с идентификатором "map-canvas". Попробуйте что-нибудь подобное ниже.
<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>
<!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=EUC-KR">
<title>Insert title here</title>
<script
    src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script>
var map;
function initialize() {
  var mapOptions = {
    zoom: 8,
    center: new google.maps.LatLng(-34.397, 150.644)
  };
  map = new google.maps.Map(document.getElementById('map-canvas'),
      mapOptions);
}

google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
 <div id="map-canvas" style="height:300px; width:500px"></div>
</body>
</html>
Чтобы правильно отобразить карту, должен быть элемент, который ее удерживает, и этот элемент должен иметь определенную высоту и ширину. Я надеюсь, что это поможет