The ID of Polyline can simply be any unique string, here we will use the stringified version of our initial LatLng object. So basically we will initialize a class variable of type Set with a single Polyline object with our initial coordinates. This will have to be initialized with a set of Polyline objects and each of these Polyline objects will be initialized with a list of LatLng points and identified by a PolylineId. Now we can see how we can use the polylines available in the package to draw lines that trace the changes in the location.įor this we will need to add the _polyline property to the GoogleMap widget. If you click the start button now, the app should change locations every 4 seconds. That should wrap up our location mocking logic. We will first add our current location as a class variable. Basically, we will implement a route tracer where we will mock the movement of the device by generating random latitude and longitudes and then drawing a polyline following the route. We can start working on the app and some of the features of the package. ![]() You can interact with it as you normally would with Google Maps. The above code should produce a result as shown below. Therefore, the zoom controls are also disabled since we won’t be using that. The GoogleMaps widget is wrapped by Stack, since we will be adding some buttons over the map.The onMapCreated property is not required per se for working on the widget, but we will need a reference to the GoogleMapController instance after the map is initialized for using other features of the maps such as markers and polylines.Normally, we would make it use the current position of our device but for right now we can hard code a random position. We need to specify the initial position to be shown on the map when it is initialized.Set the minSdkVersion in android/app/adle to 20. ![]() As mentioned before, we will need to make some changes in the native level code which are detailed below. For more info on this check out the official Google Maps documentation ().Īfter setting up the project and getting our API key, we can start by creating a new project and installing the package using flutter pub get google_maps_flutter. This will require using your credit card or some other form of payment registration, but it will provide free usage of Google Maps up to $200, which should be more than enough for our purposes. For that, you will have to create a project on Google Cloud Platform and enable the maps API. A caveat to using this package is that since we are working with Google Maps in the app, we would need a Google Maps API key. However, in this article we will try to implement some of the APIs available in the package and see how it can be used in practice.Īs always, we will start from scratch by creating a new Flutter project and then adding the google_maps_flutter package. Normally using Flutter plugins are quite straightforward and require only a package install with maybe configuring some things at the native level code. Today we will see a brief walkthrough on how to use Google Maps with Flutter, using the official google_maps_flutter plugin that is provided by the Flutter team itself.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |