I am using OpenLayers 3 and GeoServer to create a map. I would like to create a legend for the map that I have created. I've been looking for a good example I could base my map legend off of, but was struggling to do so. I used the following GetLegendGraphic to get the legend I wanted:


However, I have no idea how to display this using OpenLayers 3. Is there any way for me to create a legend without having to use anything else. If OL3 can't do this, could I use GeoExt? All the examples of GeoExt I saw were with OpenLayers 2, and I wasn't sure if GeoExt would work with OpenLayers 3.

3 Answers 3


If you just want to display a static legend you can just put your request into an img-tag:

 <div id="legend">
        <img src="http://localhost:8080/geoserver/wms?REQUEST=GetLegendGraphic&VERSION=1.0.0&FORMAT=image/png&WIDTH=20&HEIGHT=20&LAYER=cite:censustractsum&STYLE=basicstyle9">

see http://jsfiddle.net/expedio/od5eLpb9/


Here is a js fiddle with a floating legend: http://jsfiddle.net/od5eLpb9/46/


Geoext isn't and will probably never be update for ol3.


  • It is updated ol 4.4
    – wondim
    Commented Aug 29, 2020 at 10:56

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.