the beauty of mapping


Kode Iklan Disini

Sunday, December 6, 2020

Hand Drawn Polygons For Leaflet


You mightiness convey seen examples of rough.js floating roughly on social media this week. Rough.js is a novel sail based library for creating graphics which convey a sketchy, hand-drawn appearance. The library's github page includes a great d3.js present map inward which each of the states has been filled inward alongside a unlike hand-drawn style.

Rough.js doesn't entirely last alongside static maps. Because the library is sail based y'all tin too overlay hand-drawn, sketch similar polygons on last yesteryear of an interactive map. At to the lowest degree y'all tin if y'all role the novel Leaflet.RoughCanvas plug-in for Leaflet maps. The plug-in allows y'all to add together polylines as well as polygons to a Leaflet.js map which convey a hand-drawn style.

Here's a demo map which I created using Leaflet.RoughCanvas alongside a Mapbox styled base-map.