Skip to content
A Leaflet plugin to create wind arrows with direction and velocity (wind barbs)
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.
src Update leaflet-windbarb.js Jan 11, 2018
.gitattributes :octocat: Added .gitattributes & .gitignore files May 28, 2016


A small Leaflet plugin to generate wind barbs / wind arrows

Leaflet.idw generates wind barbs according to the wind barb standard shown [here] (


This plugin needs Leaflet version v1.0.0beta2 or above.


  • Example (Mobile: Working on Samsung Galaxy s4)


Image of wind barbs

Example of changed colour (Kudos Rickyars):

Image of wind barbs with colour change

Basic Usage

var icon = L.WindBarb.icon({lat: 40, deg: 90, speed: 20, pointRadius: 5, strokeLength: 20});
var marker = L.marker([lat,long], {icon: icon}).addTo(map);

Example of how to mirror velocity indication on southern hemisphere

              var icon = L.WindBarb.icon({mirrorVel: true, deg: p[3], speed: p[2]});  
              var icon = L.WindBarb.icon({lat: p[0], deg: p[3], speed: p[2]});
  • The lat is used to see if point is on north or south hemisphere

To include the plugin, just use leaflet-windbarb.js from the src folder:

<script src="leaflet-windbarb.js"></script>


Generates a wind barb / wind arrow icon with the following options:

pointRadius - Radius of point in the middle; Default = 8
strokeWidth - Stroke width; Default = 2
strokeLength - Length of the main stroke, to which the barbs are connected; Default = 15
barbSpaceing - Spacing between the barbs; Default = 5
barbHeight - Height of 10kn adn 50kn barbs, 5kn barbs will be 50%; Default = 15
forceDir - If set to "true" the direction will always be shown, even if speed < 2.5kn; Default = false
fillColor - Set the fill colour of the circle - Default = #2B85C7 (Thanks  Rickyars (
mirrorVel - mirrors velocity indication; default = false        


0.0.5 - March 30, 2017

Velocity indication should always point to equator

0.0.4 - March 30, 2017

Rickyars kindly added option to change fill colour

0.0.3 - January 30, 2017

Updated to current Leaflet version (1.0.3). Fixed marker offset issue.

0.0.1 — May 28, 2016

Initial release.
You can’t perform that action at this time.