Skip to content
Add UK Ordinance Survey map grid squares and labels to your leaflet maps
JavaScript HTML
Branch: master
Clone or download

Latest commit

jonshutt Update L.OSGraticule.js
changed let to var. so works on non es6 browsers
Latest commit 14b6411 May 28, 2017

Files

Permalink
Type Name Latest commit message Commit time
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

You can’t perform that action at this time.