OpenLayers Advanced Clustering and Setting dynamic images for OpenLayer Styles via Ajax
Update: - Read the same at Medium for better readability; Blogger is not technology blogging friendly JSFiddle Source for this Tutorial Let us start with a simple OpenLayer map In the JSP or the HTML we have <head> <script src="http://openlayers.org/api/OpenLayers.js"></script> <script type="text/javascript" src="<%=request.getContextPath()%>/js/maplister.js"></script> <script type="text/javascript" src="<%=request.getContextPath()%>/js/jquery-1.7.2.min.js"></script> <script src="http://maps.google.com/maps/api/js?v=3&sensor=false"></script> </head> <body> <div id="map-id" style="height:100%;width=100%"></div> </body> And on document load AUI().ready(function(X) { resize("scMapListerportlet", "#map-id"); var iconpath ="<%=request.getContextPath()%>/