jQuery Geo - Single Marker by maptastik

index.html

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>jQuery Geo - Starter</title>
  <style>
    body {margin: 0;padding: 0;}
    #map {
      position: absolute;
      top: 0; bottom: 0;
      width: 100%;
    }
  </style>
</head>
<body>
  <!-- Draw the map here -->
  <div id="map"></div>
  <script src="//code.jquery.com/jquery-2.2.4.min.js"></script>
  <script src="//code.jquerygeo.com/jquery.geo-1.0.0-rc1.min.js"></script>
  <script>
    $(function(){
      // set up the map
      var map = $("#map").geomap({
        center: [-85.632935, 37.857507],
        zoom: 7,
        services: [{
          id: "toner",
          type: "tiled",
          src:"//a.basemaps.cartocdn.com/light_all/{{:zoom}}/{{:tile.column}}/{{:tile.row}}.png"
        }]
      });
      
      // ADD A SINGLE MARKER TO THE MAP
      $("#map").geomap("append",
        {
          type: "Point",
          coordinates: [-84.558831, 38.209797] // Coordinates are lng/lat
        },
        {
          height: 20,
          width: 20,
          borderRadius: 20,
          color: "#2196F3",
          fillOpacity: 0.75,
          stroke: "#212121",
          strokeWidth: 1
        }
      );
    });
  </script>
</body>
</html>