Skip to content

ControlCorner

andy.rothwell edited this page Aug 31, 2018 · 6 revisions

Leaflet/ControlCorner

"Control corners" are a completely custom "hack" of the Leaflet control system. They are needed because leaflet only allows controls to be placed in the actual corners of the map:

  • topleft
  • topright
  • bottomleft
  • bottomright

A "control corner" creates another "corner" in another location on the map, in which controls can be placed.

Mapboard uses control corners to place controls in locations called:

  • topalmostleft
  • topalmostright

In a Vue template

The <control-corner> tag is put inside a <map_> tag:

<map_>
  ...
  <control-corner :vSide="'top'"
                  :hSide="'almostright'"
  >
  </control-corner>

  <control-corner :vSide="'top'"
                  :hSide="'almostleft'"
  >
  </control-corner>
  ...
</map_>