Map (experimental) example

Hide markers beneath

By default any map pins are listed beneath the map for ease of accessibility. In some situations it may be preferable to produce a different alternative to the map, so this option can be used to hide that list.

How it looks (preview)

London stations

Skip map
Loading map... This map uses JavaScript to work. To view the map, turn on JavaScript in your browser's settings.

How to call this example

<%= render "components/map", {
  hide_markers_beneath: true,
  heading_text: "London stations",
  markers: [
    {
      geometry: {
        type: "Point",
        coordinates: [
          -0.1766,
          51.5163
        ]
      },
      properties: {
        name: "Paddington Station",
        description: "Designed by Isambard Kingdom Brunel and opened in 1838."
      }
    },
    {
      geometry: {
        type: "Point",
        coordinates: [
          -0.1236,
          51.5316
        ]
      },
      properties: {
        name: "Kings Cross station",
        description: "Opened in 1852 and built on the site of a smallpox and fever hospital."
      }
    },
    {
      geometry: {
        type: "Point",
        coordinates: [
          -0.1632,
          51.5224
        ]
      },
      properties: {
        name: "Marylebone Station"
      }
    }
  ]
} %>