Add UK Ordinance Survey map grid squares and labels to your leaflet maps
JavaScript HTML
Switch branches/tags
Nothing to show
Clone or download
jonshutt Update L.OSGraticule.js
changed let to var. so works on non es6 browsers
Latest commit 14b6411 May 29, 2017
Permalink
Failed to load latest commit information.
L.OSGraticule.js Update L.OSGraticule.js May 28, 2017
README.md Add to readme May 25, 2017
demo.html Create demo.html May 24, 2017

README.md

Leaflet.OS.Graticule

Add UK Ordinance Survey style 1km grid squares to your leaflet maps.

Demo: http://htmlpreview.github.io/?https://github.com/jonshutt/Leaflet.OS.Graticule/blob/master/demo.html

Usage

    var map = L.map('map',{
      center: [56.7969, -5.0036],
      zoom: 14,
    });

    L.tileLayer(
      'http://{s}.tile.opencyclemap.org/cycle/{z}/{x}/{y}.png', {
        maxZoom: 18,
      }
    ).addTo(map);

    var options = {      
    };

    L.osGraticule(options).addTo(map);

Notes

This is UK based grid, it will continue to display outwith the lat/lng bounds of the UK however it will become more and more distorted until at some point it stops displaying.

Options

  • interval. Default = 1000. This draws a grid line every 1000m.
  • showLabels: Default = true. Displays numeric Easting and Northings on the lines
  • redraw: Default = 'move'. Sets when the grid is redrawn.
  • maxZoom: Default = 15. Limit the range that the grid is drawn.
  • minZoom: Default = 12. Limit the range that the grid is drawn.
  • gridLetterStyle: Default = 'color: #216fff; font-size:12px;'. A css string to style the labels.

Code inspiration from https://github.com/ablakey/Leaflet.SimpleGraticule