GeoServer Archives -

Get Band Information from WMS Geoserver Leafletjs

Get Band Information from WMS Geoserver Leafletjs. Band Information from Layer: In its simplest form, a raster consists of a matrix of cells (or pixels) organized into rows and columns (grid), where each cell contains a value representing information, such as temperature, precipitation or elevation etc. Rasters are digital aerial photographs, imagery from satellites, digital pictures, or even scanned maps.

Data stored in a raster format represents real-world phenomena – Get Band Information from WMS Geoserver Leafletjs:

Thematic data (also known as discrete) represents features such as land-use or soils data.
Continuous data represents phenomena such as temperature, elevation, or spectral data such as satellite images and aerial photographs.
Pictures include scanned maps or drawings and building photographs.

You may check different multidimensional multiband files like Grib files, NetCDF files and Hdf5 files.

There are three main ways to display (render) single-band raster datasets:

Using two colors—In a binary image, each cell has a value of 0 or 1 and is often displayed using black and white. This type of display is often used for displaying scanned maps with simple line work, such as parcel maps.
Grayscale—In a gray scale image, each cell has a value from 0 to another number, such as 255 or 65535. These are often used for black-and-white aerial photographs.
Color map—One way to represent colors on an image is with a color map. A set of values is coded to match a defined set of red, green, and blue (RGB) values.

When there are multiple bands, every cell location has more than one value associated with it. With multiple bands, each band usually represents a segment of the electromagnetic spectrum collected by a sensor. Bands can represent any portion of the electromagnetic spectrum, including ranges not visible to the eye, such as the infrared or ultraviolet sections. The term band originated from the reference to the color band on the electromagnetic spectrum.

This demo shows the raster overlay on map with the help of Leaflet javascript library. The raster contains three bands as Red, Blue and green. Here raster data is in GeoTiff format and is published on Geoserver. This demo is about how one can extract the Bands information from layer. In similar way we can also extract values such as elevation, any natural hazards distortion or changes in data from layers.

Get Band Information from WMS Geoserver Leafletjs

For this demo we have downloaded data from from one of the free data download website. It is a raster data containing three bands as blue, red and green. In this demo we render raster data on map and shown the value of bands using popup.

Raster data on GeoServer and styling:

GeoServer is an open source server for sharing geospatial data in both vector format and raster format. It is designed to host major datasets, which can easily render on maps.

To Download and install GeoServer please follow the last article. Then login to the GeoServer and publish data on the Geoserver and get the link from layer preview section. You can visit the articles to know how to publish and style the GeoTiff file on Geoserver and also how to make geotiff work with geowebcache for tiling.

For rendering layer on map, you need to create division for map.

var map = L.map('map').setView([34.84859848,-111.788002],5);
  L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
  attribution: '&copy; <a href=”http://osm.org/copyright”>OpenStreetMap</a> contributors'
  }).addTo(map);

Render Raster on Map:

To render this data on map, we need to get the data from GeoServer, which can be done by using leaflet javascript library. In the Leaflet library, we have Leaflet-WMS plugin.

<script src="leaflet.wms.js"></script>

What is WMS service:

WMS (web map service), is a way of publishing maps. This format is similar to map tiles, but more generic. A WMS image is defined by the coordinates.

L.tileLayer.wms: It provides a simple interface for loading tiles from a WMS service. Here we also need to provide layer name, format of layer and make transparent as true.

var raster = L.tileLayer.wms('http://139.59.42.235:8080/geoserver/portfolio/wms?',{
    layers: 'HYP_HR',
    format: 'image/png',
    transparent: true
}).addTo(map);

In this way we can render raster data and have layer information. This information further can be used for analysis purpose. For example we can have vegetation index (NDVI) from values of bands. We can actually calculate the loss information if having two time series band information.

function showGetFeatureInfo(latlng,layer){
 var prop = layer.features[0].properties;
 var mark=L.marker([latlng.lat,latlng.lng]).addTo(map);
 var blue=prop['BLUE_BAND'];
 var green=prop['GREEN_BAND'];
 var red=prop['RED_BAND'];
 mark.bindPopup("Blue Band: "+blue.toString()+"
 <br>Green Band:"+green.toString()+"
 <br>Red Band:"+red.toString());
 document.querySelector('#demoR').innerHTML=red; document.querySelector('#demoB').innerHTML=blue; document.querySelector('#demoG').innerHTML = green; }

Check more:

Large GIS Data file on Web

Speed up the rendering of data

Comment below if you found any issue in getting band information in the box provided. Thanks.

GeoServer Tiling – Web Cache Load WMS layer Fast

Here we will find out how to implement GeoServer Tiling to make wms tiles load fast.

Tile Layers from geoserver:

The need of tile layer is to speed up the rendering of data. It is similar to the Layer Preview for GeoWebCache. There are png, jpeg, geotiff many formats available to store the tiles. In all the format png is considered as fastest format to render data with geoserver.

Advantages of GeoServer tiling

Rendering is done by the client (for example, OpenLayers or leaflet), not by the server. This allows different maps/applications to style a map differently without having to reconfigure GeoServer.

The size of a vector tile is usually smaller than an image tile, resulting in faster data transfer and lower bandwidth usage.

GeoWebCache, embedded with GeoServer efficiently stores the vector tile data. Since styling is done by the client, not the server, GeoWebCache only needs to store one tile for all different styles.

Because the vector data is available on the client, very high-resolution maps can be drawn without corresponding increases in bandwidth.
The client has native access to the actual feature information (attributes and geometry), allowing for very sophisticated rendering.

For each layer, GeoServer has some information such as

1. Type: type of layer i.e. line, point or polygon layer
2. Layer name: name of the layer,
3. Disk quota: The maximum amount of disk space that can be used for this layer,
4. Disk used: The current disk space being used by tiles for this particular layer,
5. Enabled: shows whether tile caching is enabled for this layer,
6. Preview: Similar to Layer Preview, this will generate a simple OpenLayers application populated with tiles from one of the available gridset/image format combinations.
7. Action: It has two option seed/truncate or empty. Whereas seed/truncate option opens the GeoWebCache page for automatically seeding and truncating the tile cache and empty option removes all saved tiles from the cache.

Adding GeoServer Tiles

If you have already published your layer on GeoServer, and want it to be in tiles you can follow the procedure given below.

i.) First of all publish your layer with proper name and style. To know how to publish layer on GeoServer you can visit previous articles based on GeoServer.

ii.) Then go to Tile Layer option under Tile Caching. Then search your published layer in list.

iii.) Now you can open that layer as png or jpeg in preview/openLayer option or before that you can seed the layer. Seed layer is nothing but an option where you can decide the zoom level for the layer and hence number of tiles in layer.

While seeding you need to provide the given requirements mentioned below:

a) Number of threads to use:

Possible values are between 1 and 16.

b) Type of operation:

Sets the operation. There are three possible values: Seed (creates tiles, but does not overwrite existing ones), Reseed (like Seed, but overwrites existing tiles) and Truncate (deletes all tiles within the given parameters)

c) SRS (Spatial Reference System):

Specifies the projection to use when creating tiles (default values are EPSG:4326 and EPSG:900913)

d) Format:

Sets the image format of the tiles. Can be application/vnd.google-earth.kml+xml (Google Earth KML), image/gif (GIF), image/jpeg (JPEG), image/png (24 bit PNG), and image/png8 (8 bit PNG)

f) Zoom start:

Sets the minimum zoom level. Lower values indicate map views that are more zoomed out. When seeding, GeoWebCache will only create tiles for those zoom levels inclusive of this value and Zoom stop.

g) Zoom stop:

Sets the maximum zoom level. Higher values indicate map views that are more zoomed in. When seeding, GeoWebCache will only create tiles for those zoom levels inclusive of this value and Zoom start.

h) Bounding box:

(optional) Allows seeding to occur over a specified extent, instead of the full extent of the layer. This is useful if your layer contains data over a large area in GeoServer, but the application will only request tiles from a subset of that area. The four boxes correspond to Xmin, Ymin, Xmax, and Ymax.

iv.) After giving all this, you need to submit these details. After that you will be having a list containing Id, Layer, Status, Type, Estimated number of tiles, Tiles completed, Time elapsed, Time remaining and Tasks. In this list you can check the number of tiles whether it is too high or too low. It should be balanced if it is too high the data size would be high if to low then zooming will not be proper. The number of tiles depends upon zoom start and stop. If difference is very high then number of tiles will be more and vice versa, so it is advised to keep the zoom stop level less than 20.

v.) Before open this layer you should reload the configuration then open it as png and jpeg format under openLayer option.

OUTPUT of GeoServer Tiling-

You must notice that png format would open fast than jpeg format.
The images given below has left side Jpeg format and right side png format. So it is clear that tile in png format render faster than jpeg or any other format.

You also can visit Install Geoserver in linux operating system, Install GeoServer in Windows operating system, Publish and style Raster data on GeoServer, Publish and style Vector data etc.

If you find any problem during implementing this tutorial, please let us know. Feel free to comment in given comment box provided below.

Large GIS Data file on Web | GeoServer Importance

Render Large GIS Data file on Web | GeoServer Importance. For producing any detail map, we need to have large detailed dataset. If it is about country level or world level analysis data it may create huge problems with huge dataset. It can hang your system or slow down it if not used properly. Even for browser it is dangerous because browser takes time or get in not responding mode. More than this you want to change or query data with rendering it on map, this will take much of your precise time. Here is what we are going to discuss how should we avoid rendering the large vector layer from leaflet js or any other library in browser and instead, look for the server side tile to render the same as like GeoServer.

Render Large GIS Data file on Web | GeoServer Importance

To solve this problem we use some servers which can handle the dataset and provide us when required. For the map data we have one the great solution that is geoserver. What is geoserver and how it is helping us? geoserver is an open-source server written in Java that allows users to share, process and edit geospatial data. It helps us to display the information to the world. It has a great feature that using WMS standards it provides variety for output format.

What is WMS – WMS helps in rendering Large GIS Data file on Web

It is the Web Map Service Interface Standard (WMS) provides a simple HTTP interface for requesting Geo-registered map images from one or more distributed geospatial databases. A WMS request defines the geographic layers and area of interest to be processed. The response to the request is one or more Geo-registered map images (returned as JPEG, PNG, etc) that can be displayed in a browser application. The interface also supports the ability to specify whether the returned images should be transparent so that layers from multiple servers can be combined or not.

Using this with leaflet or Openlayer we can easily create beautiful and interactive maps. It also uses WFS standards, which gives us permission to actually edit and share the data to generate maps. This is also integrating with some popular API such as Google Maps, Google Earth, Yahoo Maps, and Microsoft Virtual Earth. In addition, GeoServer can connect with traditional GIS architectures such as ESRI ArcGIS. Now you might be thinking how geoserver is handling this much of data. Lets explore this topic next.

If you are just starting with Geoserver, then you look for install geoserver in windows or install geoserver in ubuntu system. Looking for further web development with geoserver then you can check out other articles too i.e GIS Web Development with geoserver, leaflet and postgis, publish GIS data with api in geoserver, styling raster data and vector data style and other operation like split polygon with WFS in Geoserver.

How Geoserver handles Rendering for Large GIS Data file on Web

The reason is OCFS2 (Oracle Cluster File System 2) , which is a free, open source, general-purpose, extent-based clustered file system which Oracle developed and contributed to the Linux community, and accepted into Linux kernel 2.6.16. Building on Oracle’s long-term commitment to the Linux and open source community, OCFS2 provides an open source, enterprise-class alternative to proprietary cluster file systems, and provides both high performance and high availability. Cluster- aware applications can leverage cache-coherent parallel I/O for higher performance, and other applications can make use of the file system to provide a fail-over setup to increase availability.

Other than this geoserver is having 16 GB memory and geoWebCache has 16 to 32 GB memory. One of reason for high speed performance of geoserver is GeoWebCache. As when new maps with vector data and raster data as tiles are requested, GeoWebCache intercepts these calls and returns pre-rendered tiles if stored, or calls the server to render new tiles as necessary. Thus, once tiles are stored, the speed of map rendering increases by many times.

This way you should use GeoServer or any other Server side Tools or Software to render Large GIS Data file on Web. I hope you find this article helpful the importance of GeoServer. If you have any suggestions or questions to ask, do comment below. Thanks.

PostGIS, Geoserver and Leaflet | GIS Web Development

In this article we will see how data can query in Postgres and store and view at Geoserver and Leaflet i.e GIS Web Development with PostGIS, Geoserver and Leaflet. For this you will require setup of all three. You can visit our tutorial to install Geoserver For Linux or geoserver install in windows, Postgres and Postgis installation for Ubuntu 16.04. and a basic of Leaflet Js Javascript Library. If you are done with intial setup, then we can first start with to adding Shapefile in postgres by creating database in database.

PostGIS, Geoserver and Leaflet | GIS Web Development – Steps

Step 1: After installing Geoserver and Postgress postgis in your system you need to download dataset. The data we are using is shapefile for this tutorial, which you can download from the sources given in this post. The shapefile can be administrative boundary or road network etc. For any region. This website will help you to download zip file as well, which will have all supporting file for shapefile.

Step 2: Now you need to open Postgres, add database, table and add shape file using shp2pgsql. This all has been explained in our tutorial.

Step 3: Start Geoserver by running shell file provided in bin folder of geoserver. That can be run by executing the given command on terminal.

cd <path to Geoserver/bin>
sh startup.sh

Then Open browser and type

http://localhost:8080/geoserver

and login by using your credentials. Generally its admin as username and password as geoserver.

Step 4: Now create a new workspace on Geoserver. Now Move to workspace option in data section by providing required information. Create new store as PostGIS and provide information required. Here you need to give workspace name and data source name you created. If you want you can write the description about your data.

PostGIS, Geoserver and Leaflet | GIS Web Development

Now you need to provide connection parameter.

Dbype is the type of database, you can leave it as default or can specify your database type. Host and port: these are the parameter, which help geoserver to connect with postgres. The Host is space where database exist. The port to connect with postgres host, you can provide if you have set any otherwise make it as 5432.

Database: this is the database, which you have created using postgis. You are not sure about the name you can check it on pgAdmin or in terminal.

\l : this will provide you the list of available database. For this you must work with proper user-name.

Schema: to know your table, which you have created in database you can execute \d as this will provide you list of table associated database with their schema.

User and Password: this the USER with whom you have created database. In postgres you can create a new user with proper password.

Namespace: Namespace to be associated with the database. This field is altered by changing the workspace name. Remaining option you can leave as it is. And save the information.

Stpe 5: Now open the Layer option in data section, searched for your workspace and publish the layer.

Stpe 6: Here you will see tabs as data and publishing. In data tab you need to provide the reference coordinate system (CRS) by clicking on compute from data or compute from native bounds. After this you can save this layer with default styling. If you want to style your layer, which includes color, symbols etc. You can visit our tutorial styling vector data.

Step 7: Now moving to layer preview option in same data section. Here you can see your shape file.

Step 8: The shape file now can be render on map using leaflet javascript library.

For that you need to create HTML file, add leaflet library. After this create a div, which will contain map. Using L.map() and initialize the map and set view using setView() this takes center latitude longitude and zoom as arguments. You can check how to load a layer of polygon, point or polyline in leafletjs.

After that the shape file using L.TileLayer.WMS() , provide the base WMS URL, and specify whatever WMS options you need. The option can be layer, transparent and format etc. After this use addTo() function to add layer to initialized map. Open that HTML file on browser to see the map with rendered shapefile.

Hope this PostGIS, Geoserver and Leaflet | GIS Web Development helped you in creating a map layer of shapefile which is loaded in postgis, and added the wms layer from geoserver which is then served as map in browser with leafletjs. If you find any problem in understanding the same, do let us know by commenting below.