I am using QGIS Server and Leaflet to display geotiffs on my website. I have created an onMapClick function which uses a GetFeatureInfo request to QGIS Server which returns the value of the geotiff in a popup. The function looks like this:
popup = new L.Popup({maxWidth: 400});function onMapClick(e){ var BBOX = map.getBounds().toBBoxString(); var WIDTH = map.getSize().x; var HEIGHT = map.getSize().y; var X = map.layerPointToContainerPoint(e.layerPoint).x.toFixed(0); var Y = map.layerPointToContainerPoint(e.layerPoint).y.toFixed(0);var alayer = 'Ppt%20ElW%20(mm)';var gfURL = URL + '?SERVICE=WMS&VERSION=1.1.1&REQUEST=GetFeatureInfo&LAYERS=' + alayer + '&' + 'BBOX=' + BBOX + '&HEIGHT=' + HEIGHT + '&WIDTH=' + WIDTH + '&FORMAT=image%2Fpng&' + 'INFO_FORMAT=text%2Fhtml&X=' + X2 + '&Y=' + Y2 + '&CRS=EPSG:4326&QUERY_LAYERS='+alayer;$.ajax({ url: gfURL, dataType: "html", type: "GET", success: function(data){ popup.setContent(data); popup.setLatLng(e.latlng); map.openPopup(popup); }});};map.on('click', onMapClick);For some reason, the calculated Y value is slightly inaccurate. It is close, but does not align completely with the geotiff grid-cells. It will be apparent when you try to use the website. The inaccuracy varies with the zoom level. I have been trying to figure this out for weeks and cannot seem to get anywhere.
This is my first post, so let me know if I have forgotten any relevant information.
Thanks for the help.
أكثر...
popup = new L.Popup({maxWidth: 400});function onMapClick(e){ var BBOX = map.getBounds().toBBoxString(); var WIDTH = map.getSize().x; var HEIGHT = map.getSize().y; var X = map.layerPointToContainerPoint(e.layerPoint).x.toFixed(0); var Y = map.layerPointToContainerPoint(e.layerPoint).y.toFixed(0);var alayer = 'Ppt%20ElW%20(mm)';var gfURL = URL + '?SERVICE=WMS&VERSION=1.1.1&REQUEST=GetFeatureInfo&LAYERS=' + alayer + '&' + 'BBOX=' + BBOX + '&HEIGHT=' + HEIGHT + '&WIDTH=' + WIDTH + '&FORMAT=image%2Fpng&' + 'INFO_FORMAT=text%2Fhtml&X=' + X2 + '&Y=' + Y2 + '&CRS=EPSG:4326&QUERY_LAYERS='+alayer;$.ajax({ url: gfURL, dataType: "html", type: "GET", success: function(data){ popup.setContent(data); popup.setLatLng(e.latlng); map.openPopup(popup); }});};map.on('click', onMapClick);For some reason, the calculated Y value is slightly inaccurate. It is close, but does not align completely with the geotiff grid-cells. It will be apparent when you try to use the website. The inaccuracy varies with the zoom level. I have been trying to figure this out for weeks and cannot seem to get anywhere.
This is my first post, so let me know if I have forgotten any relevant information.
Thanks for the help.
أكثر...