diff --git a/.gitignore b/.gitignore
index e43b0f988..538c8c553 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1 +1,2 @@
.DS_Store
+*~
diff --git a/README.md b/README.md
index cd29d4a2a..93ede1808 100644
--- a/README.md
+++ b/README.md
@@ -22,7 +22,7 @@ Now use the plugin to create a marker like this:
````js
// Creates a red marker with the coffee icon
var redMarker = L.AwesomeMarkers.icon({
- icon: 'icon-coffee',
+ icon: 'coffee',
color: 'red'
})
@@ -44,13 +44,26 @@ The 'color' property currently supports these strings:
### Supported icons
The 'icon' property supports these strings:
-- 'icon-coffee'
-- 'icon-food'
-- 'icon-plane'
-- 'icon-star'
-- 'icon-beer'
+- 'coffee'
+- 'food'
+- 'plane'
+- 'star'
+- 'beer'
- .... and many more, see: http://fortawesome.github.com/Font-Awesome/#icons-new
+### Spinning icons
+You can make any icon spin by setting the spin option to true:
+````js
+// Creates a red marker with the coffee icon
+var redMarker = L.AwesomeMarkers.icon({
+ icon: 'spinner',
+ color: 'red',
+ spin: true
+})
+
+L.marker([51.941196,4.512291], {icon: redMarker}).addTo(map);
+````
+
## License
- Leaflet.AwesomeMarkers and colored markers are licensed under the MIT License - http://opensource.org/licenses/mit-license.html.
- Font Awesome: http://fortawesome.github.com/Font-Awesome/#license
diff --git a/dist/leaflet.awesome-markers.js b/dist/leaflet.awesome-markers.js
index da84e72b6..56fc6317f 100644
--- a/dist/leaflet.awesome-markers.js
+++ b/dist/leaflet.awesome-markers.js
@@ -20,7 +20,7 @@ L.AwesomeMarkers.Icon = L.Icon.extend({
iconAnchor: [17, 42],
popupAnchor: [1, -32],
shadowAnchor: [10, 12],
- icon: 'icon-font', // All the font-awesome icons are possible
+ icon: 'font', // All the font-awesome icons are possible
shadowSize: [36, 16],
className: 'awesome-marker',
color: 'blue' // red, orange, green, blue, purple
@@ -48,7 +48,13 @@ L.AwesomeMarkers.Icon = L.Icon.extend({
},
_createInner: function() {
- return "";
+ var iconClass;
+ if(this.options.icon.slice(0,5)==="icon-"){
+ iconClass=this.options.icon;
+ }else{
+ iconClass="icon-"+this.options.icon;
+ }
+ return "";
},
_setIconStyles: function (img, name) {
diff --git a/examples/basic-example.html b/examples/basic-example.html
index 9975671b4..da11325c9 100644
--- a/examples/basic-example.html
+++ b/examples/basic-example.html
@@ -27,19 +27,19 @@
key: 'BC9A493B41014CAABB98F0471D759707'
}).addTo(map);
- L.marker([51.941196,4.512291], {icon: L.AwesomeMarkers.icon({icon: 'icon-coffee', color: 'red'}) }).addTo(map);
+ L.marker([51.941196,4.512291], {icon: L.AwesomeMarkers.icon({icon: 'spinner', color: 'red', spin:true}) }).addTo(map);
L.marker([51.927913,4.521303], {icon: L.AwesomeMarkers.icon({icon: 'icon-coffee', color: 'red'}) }).addTo(map);
- L.marker([51.936063,4.502077], {icon: L.AwesomeMarkers.icon({icon: 'icon-food', color: 'purple'}) }).addTo(map);
- L.marker([51.932835,4.506969], {icon: L.AwesomeMarkers.icon({icon: 'icon-glass', color: 'green'}) }).addTo(map);
- L.marker([51.930295,4.515209], {icon: L.AwesomeMarkers.icon({icon: 'icon-shopping-cart', color: 'blue'}) }).addTo(map);
- L.marker([51.930083,4.507742], {icon: L.AwesomeMarkers.icon({icon: 'icon-comments', color: 'orange'}) }).addTo(map);
+ L.marker([51.936063,4.502077], {icon: L.AwesomeMarkers.icon({icon: 'food', color: 'purple'}) }).addTo(map);
+ L.marker([51.932835,4.506969], {icon: L.AwesomeMarkers.icon({icon: 'glass', color: 'green'}) }).addTo(map);
+ L.marker([51.930295,4.515209], {icon: L.AwesomeMarkers.icon({icon: 'shopping-cart', color: 'blue'}) }).addTo(map);
+ L.marker([51.930083,4.507742], {icon: L.AwesomeMarkers.icon({icon: 'comments', color: 'orange'}) }).addTo(map);
- L.marker([51.930454,4.527054], {icon: L.AwesomeMarkers.icon({icon: 'icon-group', color: 'darkred'}) }).addTo(map);
- L.marker([51.929607,4.527054], {icon: L.AwesomeMarkers.icon({icon: 'icon-arrow-right', color: 'darkblue'}) }).addTo(map);
- L.marker([51.928919,4.528856], {icon: L.AwesomeMarkers.icon({icon: 'icon-twitter', color: 'cadetblue'}) }).addTo(map);
- L.marker([51.930295,4.530745], {icon: L.AwesomeMarkers.icon({icon: 'icon-phone', color: 'darkpurple'}) }).addTo(map);
- L.marker([51.925055,4.512806], {icon: L.AwesomeMarkers.icon({icon: 'icon-ambulance', color: 'darkgreen'}) }).addTo(map);
- L.marker([51.925902,4.505768], {icon: L.AwesomeMarkers.icon({icon: 'icon-medkit', color: 'darkblue'}) }).addTo(map);
+ L.marker([51.930454,4.527054], {icon: L.AwesomeMarkers.icon({icon: 'group', color: 'darkred'}) }).addTo(map);
+ L.marker([51.929607,4.527054], {icon: L.AwesomeMarkers.icon({icon: 'arrow-right', color: 'darkblue'}) }).addTo(map);
+ L.marker([51.928919,4.528856], {icon: L.AwesomeMarkers.icon({icon: 'twitter', color: 'cadetblue'}) }).addTo(map);
+ L.marker([51.930295,4.530745], {icon: L.AwesomeMarkers.icon({icon: 'phone', color: 'darkpurple'}) }).addTo(map);
+ L.marker([51.925055,4.512806], {icon: L.AwesomeMarkers.icon({icon: 'ambulance', color: 'darkgreen'}) }).addTo(map);
+ L.marker([51.925902,4.505768], {icon: L.AwesomeMarkers.icon({icon: 'medkit', color: 'darkblue'}) }).addTo(map);