Map (experimental) example

Custom bounds

This allows the initial position of the map to be set.

How it looks (preview)

Places with Ham in their name

There's another one over in the east, look.

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", {
  heading_text: "Places with Ham in their name",
  description: sanitize("<p>There's another one over in the east, look.</p>
    "),
  bounds: [
    -3.203169743770889,
    51.643668495828116,
    -0.8983602517140259,
    50.68105666989489
  ],
  geojson: "data:application/geo+json;base64,ewogICJ0eXBlIjogIkZlYXR1cmVDb2xsZWN0aW9uIiwKICAiZmVhdHVyZXMiOiBbCiAgICB7CiAgICAgICJpZCI6IDEsCiAgICAgICJ0eXBlIjogIkZlYXR1cmUiLAogICAgICAicHJvcGVydGllcyI6IHsKICAgICAgICAibmFtZSI6ICJIYW1icmlkZ2UsIFNvbWVyc2V0IgogICAgICB9LAogICAgICAiZ2VvbWV0cnkiOiB7CiAgICAgICAgImNvb3JkaW5hdGVzIjogWwogICAgICAgICAgLTIuODcsCiAgICAgICAgICA1MC45OAogICAgICAgIF0sCiAgICAgICAgInR5cGUiOiAiUG9pbnQiCiAgICAgIH0KICAgIH0sCiAgICB7CiAgICAgICJpZCI6IDIsCiAgICAgICJ0eXBlIjogIkZlYXR1cmUiLAogICAgICAicHJvcGVydGllcyI6IHsKICAgICAgICAibmFtZSI6ICJIYW1icm9vaywgU291dGggR2xvdWNlc3RlcnNoaXJlIgogICAgICB9LAogICAgICAiZ2VvbWV0cnkiOiB7CiAgICAgICAgImNvb3JkaW5hdGVzIjogWwogICAgICAgICAgLTIuNTIsCiAgICAgICAgICA1MS40OQogICAgICAgIF0sCiAgICAgICAgInR5cGUiOiAiUG9pbnQiCiAgICAgIH0KICAgIH0sICAgIAogICAgewogICAgICAiaWQiOiAzLAogICAgICAidHlwZSI6ICJGZWF0dXJlIiwKICAgICAgInByb3BlcnRpZXMiOiB7CiAgICAgICAgIm5hbWUiOiAiSGFtYmxlLWxlLVJpY2UsIEhhbXBzaGlyZSIKICAgICAgfSwKICAgICAgImdlb21ldHJ5IjogewogICAgICAgICJjb29yZGluYXRlcyI6IFsKICAgICAgICAgIC0xLjMzLAogICAgICAgICAgNTAuODUKICAgICAgICBdLAogICAgICAgICJ0eXBlIjogIlBvaW50IgogICAgICB9CiAgICB9LCAgICAgICAgCiAgICB7CiAgICAgICJpZCI6IDQsCiAgICAgICJ0eXBlIjogIkZlYXR1cmUiLAogICAgICAicHJvcGVydGllcyI6IHsKICAgICAgICAibmFtZSI6ICJIYW0sIEtlbnQiCiAgICAgIH0sCiAgICAgICJnZW9tZXRyeSI6IHsKICAgICAgICAiY29vcmRpbmF0ZXMiOiBbCiAgICAgICAgICAxLjMyNiwKICAgICAgICAgIDUxLjIzMwogICAgICAgIF0sCiAgICAgICAgInR5cGUiOiAiUG9pbnQiCiAgICAgIH0KICAgIH0gICAgCiAgXQp9Cg=="
} %>