![]() ![]() ![]() Each marker is a lng,lat pair separated by commas. ![]() More than one marker can be added to the map. To add markers to a map image, a parameter called markers must be used in the URL. The API also offers the possibility of adding information to these images, such as a marker at a specified position or drawing a line or a polygon on the map. To create a link to a map, you must indicate the map identifier (mapId) in the URL path ?key= YOUR_API_KEY We recommend reading the article How to protect your map key to protect your account and data.Ģ. ![]() In the case of making an API call without the key parameter, the following error is obtained "Missing key - Get your FREE key at " The API key must be passed in a parameter called key in API requests. Your MapTiler account access key is on your MapTiler Cloud account page or Get API key for FREE. The first thing we need to know to use the API is that all of the requests to the API have to be authorized using your API key. How to search places by coordinates (reverse) How to search places by name (forward)Ĩ.3. How to create a map image with lines or polygonsĨ.2. How to use the OGC WMTS service in your mapģ.2. How to use raster tiles in your mapĢ.2.3. How to use vector tiles in your mapĢ.2.2. How to add an interactive map on a web pageĢ.2.1. This article uses different use cases and examples to explain how to use the main options offered by the MapTiler Cloud API to create maps.Ģ.2. Explore the MapTiler Cloud API to see all its features. Through the API, you can add a map directly to your website, create an image with a location map for your business, search for addresses, etc. _liveSubs = _mapController.liveStream?.The MapTiler Cloud API allows access to all the data, maps, and resources in the MapTiler Cloud without having to open a browser. We can let the map live while also listening to current user's location by subscribing to liveStream of MapController. Live Map without Auto Moving Live Stream Maps # moveWhenLive has default value set to true move the center of the maps automatically to that location. set the location indicator to current user location, but does not moveWhenLive: false will make the map live (constantly search for user location), If you want to go live (always searching for user's current location and show location indicator to that location), but don't want to move the center of the maps, you can set parameter moveWhenLive to false. The default behavior of Live Map is always move the center of the maps to user's current location. Live Map with Location Marker Live Maps Without AutoMoving # Tap to Add Marker Live Maps # U.OpenStreetMap( Here is a simple way of adding marker to universe maps. HERE Map (Need App ID & Credentials Code) Markers # Multi TileLayer Maps example Other Map Providers # ' attribution: 'Data: © OpenStreetMap contributors | Style: © OpenRailwayMap', add environmental measurements map layer from SafeCast ()Īttribution: 'Data: © OpenStreetMap contributors | Style: © SafeCast', Here is an example of using Humanitarian OpenStreetMap combined with map tiles from SafeCast and OpenRailwayMap. We can create maps with multiple tile layers. U.Map(īase: U.TileLayer(' attribution: 'Map data: © OpenStreetMap contributors, SRTM | Map style: © OpenTopoMap',Ĭomplete Custom Map example Multi TileLayer Maps # Here is an example of using custom map from OpenTopoMap. We can call U.Map directly to use maps with custom map providers. List of available MapBoxTypeĬomplete MapBox example Custom Map Provider # Please always use your own access token in your projects. You can get your own MapBox access token from here. import 'package:universe/universe.dart' Ĭomplete OpenStreetMap example Google Maps # U.GoogleMap(Ĭomplete Google Maps example MapBox # U.MapBox( Inspired by the simplicity of Leaflet.js, we can integrate maps in our flutter project with as simple as adding these lines of code. Or install the example apk and try it on your device: universe.apk. Learn complete examples in this folder for many use cases of using Universe. Supports OpenStreetMap, Google Maps, MapBox and much more.Īdd permissions to your android AndroidManifest.xml. The easy & flexible way to use interactive maps in Flutter. ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |