--- steps/step-5/index.html 2023-09-11 11:38:21.656650988 +0000
+++ steps/step-6/index.html 2023-09-11 11:38:25.640670404 +0000
@@ -1,13 +1,16 @@
<!DOCTYPE html>
<html>
<head>
- <title>Add a search field</title>
+ <title>Adding a Marker</title>
<meta charset="utf-8" />
<script src="../../bower_components/leaflet/dist/leaflet.js"></script>
<link rel="stylesheet" href="../../bower_components/leaflet/dist/leaflet.css"/>
<script src="../../bower_components/leaflet-providers/leaflet-providers.js"></script>
<link rel="stylesheet" href="../../bower_components/leaflet-search/src/leaflet-search.css"/>
<script src="../../bower_components/leaflet-search/src/leaflet-search.js"></script>
+ <link rel="stylesheet" href="../../bower_components/font-awesome/css/font-awesome.css">
+ <link rel="stylesheet" href="../../bower_components/Leaflet.awesome-markers/dist/leaflet.awesome-markers.css"/>
+ <script src="../../bower_components/Leaflet.awesome-markers/dist/leaflet.awesome-markers.js"></script>
<style>
body {
margin: 0;
@@ -53,6 +56,14 @@
myMap.addControl(searchControl);
+ var redMarker = L.AwesomeMarkers.icon({
+ icon: 'coffee',
+ prefix: 'fa',
+ markerColor: 'red'
+ });
+
+ var poi = L.marker(latLon, {icon: redMarker}).addTo(myMap);
+ poi.bindPopup("<b>test</b><hr/>foobar");
</script>
</body>
</html>