Map not showing up using Leaflet in JSP page.Tiles are available
Question
We are trying to show offline maps in Web application. Succeeded in extracting the required portion and converting them into tiles.
The tiles folder is located inside the WEB-INF and all the required folder for tiles is present inside the tiles folder.
Leaflet script is present inside the script folder. css script is present inside the css folder.
The code snippet of my page is:
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="f" uri="http://java.sun.com/jsf/core"%>
<%@ taglib prefix="h" uri="http://java.sun.com/jsf/html"%>
<%@ taglib uri="http://richfaces.org/a4j" prefix="a4j"%>
<%@ taglib uri="http://richfaces.org/rich" prefix="rich"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!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>Demon</title>
<link href="${pageContext['request'].contextPath}/css/general.css"
rel="stylesheet" type="text/css" />
<link href="${pageContext['request'].contextPath}/css/leaflet.css"
rel="stylesheet" type="text/css" />
<script src="${pageContext['request'].contextPath}/script/leaflet.js" language="javascript"></script>
<script src="${pageContext['request'].contextPath}/script/leaflet-src.js" language="javascript"></script>
<script>
function Demo()
{
var map = L.map('map');
L.tileLayer('tiles/{z}/{x}/{y}.png').addTo(map);
}
</script>
</head>
<body>
<f:view>
<div id="map" style="width:800px;height:600px;">
<a4j:commandButton value="HIT" onclick="Demo()"></a4j:commandButton>
</div>
</f:view>
</body>
</html>
Now on my page, when I click on HIT button , the map portion is taken up and displayed in the browser in the space allocated but NOTHING IN THE MAPS SHOW..
Powered by Leaflet and Zoom in/out icon definitely comes.
NO MAP IS SHOWN. The tile images which are present in the folder do contain a map which was extracted and converted into the tiles.
Hence I am unable to figure out why nothing is appearing at all. Please guide me.
I think i am very close to showing a map and nonetheless it has been one hell of a ride to explore this and arrive till this point.
1 answers
solution1
0 2015-12-03 10:58:47
I did this it may help, I used \\ as an escape character before $ so JSP can understand the url containg ${} , or it will consider it an empty variable?
Problem:
var newLayer = new OpenLayers.Layer.OSM("Damascus", "tiles/${z}/${x}/${y}.png", {numZoomLevels: 19, alpha: true, isBaseLayer: true});
Solution:
var newLayer = new OpenLayers.Layer.OSM("Damascus", "tiles/\${z}/\${x}/\${y}.png", {numZoomLevels: 19, alpha: true, isBaseLayer: true});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.