Geek Answers Handbook

How to use Google Map Api in JSP?

I am following the sample code from the Google Maps API webpage that uses JavaScript and HTML. The HTML sample works fine, but using the JavaScript source in JSP to create Google Maps does not work.

<%@ 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>

This is from the documentation . How to use Google Api v3 in JSP Source?

+7
javascript jsp google-maps google-maps-api-3
source share
1 answer

If the code you posted above is for the jsp you are talking about, then you skipped to add a div with id 'map-canvas'. Try something like below.

 <%@ 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>

To correctly display the map, there must be an element to hold it, and this element must have a certain height and width. Hope this helps

+9
source share

More articles:


All Articles