What is it?
The Map widget enables you to show a map to the user and to display their location on the map. Street maps from Google and Open Street Maps, and satellite maps from Google are all available.
How do I use it?
Go to the Layout tool and click on the Map tab in the widget panel on the left. Remember that clicking on the 'i' symbol will give you some more information on the widget.
Drag the map icon from the right hand side of the panel to the page. Feel free to resize and re-position the Map widget on the page, and set the page's background colour.
Select the Map widget again and then the Settings tab in the property panel. Use the dropdown to explore the other values for the map type property, checking the effects of your choice in the Preview tool.
To show the user's location on the map, ensure that the checkbox for the Map's track user property is checked.
You can see the effect of this property in the Preview tool. Click around on the map in the right hand panel of the Preview and you will see a person icon representing the user's location move around in the map on the phone emulation.
On the real phone, the user will be able to pan and zoom the map with drag and pinch gestures. In the Preview tool, you can pan by holding the mouse down on the Map widget and scroll with the mouse's scroll wheel. Later, we will show you how to add buttons to zoom the map. Note that while you are tracking the user's position, the map will be automatically panned to include their current position.
What properties does it have?
Many of the Map widget's properties are shared with other widgets and allow you to control its size, position, whether it has a border etc. You can always see the full list by clicking on the 'i' button on the Map tab in the widget panel, as shown above. Here are the properties not to do with styling that are specific to the Map widget:
The type of map to display
|Google Streets||Google street map.|
|Google Satellite||Google Satellite map.|
|OSM||OSM street map.|
|Google Street||Google Satellite||Open Street Map|
Note that the Google Maps TOS explicitly allow use in both free and paid-for mobile apps, though it is worth checking occasionally to ensure they have not changed.
Initial longitude of the center of the map
Initial latitude of the center of the map
Together these determine where the map will be centred when it first appears on the screen.
Initial zoom level of the map
Selects whether the map will show the user's location.
Maps and network connectivity
All three of the available map types - Google Streets, Google Satellite and OSM - refer to mapping data held remotely on the internet and fetched by the mobile phone as needed. That means that the maps cannot be displayed at all if the phone is not connected to the network, and may perform unsatisfactorily if network connectivity is intermittent or very slow.