MapWrapper can act as a layer between your code and mapping libraries such as Mapbox GL JS and OpenLayers, as well as mapping providers such as Google and Bing; this level of indirection allows you to easily switch underlying map providers without having to change much code.
Even if you do not plan on switching map providers, MapWrapper simplifies the customization of information windows, allowing you to style them the way you want. MapWrapper's information windows are not constrained by the boundaries of the map, and open intelligently, taking into consideration how much room is left between the marker and the browser window boundaries.
A few things to note:
- To get started, use a div and pass the id into the map constructor; this div is where the map will be anchored in the DOM
- The anchor div needs to have a height set
- The script for the underlying map needs to be loaded on the page before the map is initialized