tplmapsflutterplugin 2.0.3

TPL Maps Flutter Plugin.

Flutter TPL Maps (v-1.6.4 OR v-2.0.0+)

Flutter TPL Maps Android, iOS plugin for Flutter Apps. It will help you to add maps in your application. The API automatically handles access to our TPL Maps servers, data downloading, map display, and response to map gestures. You can do add markers, shapes, POIs show/hide point of interests, custom map styles and much more.

Maintainers

TPL Maps

• Bilal Sipra - Head of Information Technology (IT) - [e-mail]
• Daniyal Ahmed Khan - Manager & Team Lead (Android Development) - [e-mail]
• Muhammad Aamir - Senior Software Engineer - [e-mail]

Platform Compatibility

This project is compatible with Android , iOS This project is compatible with Android Minimum SDK 21.

Getting Started

Please follow the below steps:

1- Add the latest version of package in your pubspec.yml
2- Add your TPL Maps Key in Android Manifest File like below

 <meta-data android:name="com.tplmaps.android.sdk.API_KEY"
            android:value="YOUR_API_KEY" />

4- Add tplservices.config file in iOS project (Download from api.tplmaps.com follow iOS guide.)

5- **Access in dart classes import 'package:tplmapsflutterplugin/tplmapsflutterplugin.dart'; **

Usage

return TplMapsView(
        isShowBuildings: true,
        isZoomEnabled: true,,
        showZoomControls: true,,
        isTrafficEnabled: true,,
        mapMode: MapMode.NIGHT,
         enablePOIs: true,,
         setMyLocationEnabled: false,
         myLocationButtonEnabled: false,
         showsCompass: true,,
         allGesturesEnabled: true,,
 tplMapsViewCreatedCallback: _callback,
 );
 void _callback (TplMapsViewController controller)
 {
 }
 
 
 
 void _callback(TplMapsViewController controller) {
        _controller = controller;
        controller.showBuildings(false);
        controller.showZoomControls(false);
        controller.setTrafficEnabled(false);
        controller.enablePOIs(true);
        controller.setMyLocationEnabled(true);
        controller.myLocationButtonEnabled(true);
        controller.showsCompass(false);
        controller.setCameraPositionAnimated(33.698047971892045,
        73.06930062598059,14.0);
        controller.addMarker(33.705349, 73.069788);
        controller.addMarker(33.698047971892045, 73.06930062598059);
        controller.setMapMode(MapMode.DEFAULT);
        bool isBuildingsEnabled = controller.isBuildingEnabled;
        print("isBuildingsEnabled: $isBuildingsEnabled");
        bool isTrafficEnabled = controller.isTrafficEnabled;
        print("isTrafficEnabled: $isTrafficEnabled");
        bool isPOIsEnabled = controller.isPOIsEnabled;
        print("isPOIsEnabled: $isPOIsEnabled");
}

Draw Marker and Shapes

    void _callback( TplMapsViewController: controller ){
     _controller = controller;
    };
    void addMarker(){
     _controller.addMarker(33.705349, 73.069788);
    };
    void addPolyLine(){
    _controller.addPolyLine(33.705349, 73.069788, 33.705349, 73.069788);
    };
    
    void addCircle(){
    _controller.addCircle(33.705349, 73.069788);
    };
    
    void removeMarkers(){
    _controller.removeAllMarker();
    };
    
    void removePolyline(){
    _controller.removePolyline();
    };
    
    void removeAllCircles(){
    _controller.removeAllCircles();
    };
    
     ....
    _controller.setZoomEnabled(true);
    _controller.showBuildings(false);
    _controller.showBuildings(false);
    _controller.showZoomControls(false);
    _controller.setTrafficEnabled(false);
    _controller.enablePOIs(true);
    _controller.setMyLocationEnabled(true);
    _controller.myLocationButtonEnabled(true);
    _controller.showsCompass(false);
    _controller.setCameraPositionAnimated(33.69804797189, 73.0693006259, 14.0);
    _controller.setMapMode(MapMode.DEFAULT);
    _controller.isBuildingEnabled;
    _controller.isTrafficEnabled;
    _controller.isPOIsEnabled;
    
    ;

Gestures Controls

    return TplMapsView(
        tPlMapsViewMarkerCallBack: _markerCallback,
    );
    void _markerCallback(String callback){
        log(callback);
    };

Setup Places API

    TPlSearchViewController tPlSearchViewController = TPlSearchViewController
        ("Atrium Mall" , 24.8607 , 67.0011 , (retrieveItemsCallback) {

         // You will be get json list response

            print(retrieveItemsCallback);

         },);

    tPlSearchViewController.getSearchItems();

Initialize Reverse Geocding Params with location to get Address,For example

    TPlSearchViewController tPlSearchViewController = TPlSearchViewController
        (null , 24.8607 , 67.0011 , (retrieveItemsCallback) {

            // you will get the address here of the passing location

                print(retrieveItemsCallback);

            },);

        tPlSearchViewController.getReverseGeocoding();

Setup Routing API

        Initialize TPL Routing with Starting and Destination LatLng

        TPLRoutingViewController tplRoutingViewController =
        TPLRoutingViewController(24.820159, 67.123933, 24.830831, 67.080857 ,
        (tplRoutingCallBack) => {

        // You will be get json list response

        log(tplRoutingCallBack)

        },);

    tplRoutingViewController.getSearchItems();

Latest Flutter SDK Version 2.0.0+

Set initial Camera Position

Container(
            child: TplMapsView(
              isZoomEnabled: true,
              mapMode: MapMode.DEFAULT,
              allGesturesEnabled: true,
              initialCameraPosition: CameraPosition(
                target: LatLng(33.723149149167504,73.06167650992974),
                zoom: 14.0
              ),
            ),
          )

Adding Markers, Custom Markers And Info Window

Container(
            child: TplMapsView(
              isZoomEnabled: true,
              mapMode: MapMode.DEFAULT,
              allGesturesEnabled: true,
              markers: [
                Marker(
                    latLng: LatLng(33.723149149167504, 73.06167650992974)
                ),
                Marker(
                    latLng: LatLng(33.726140321422804, 73.07676244254161),
                    size: MarkerSize(width: 35, height: 35)
                ),
                Marker(
                    latLng: LatLng(33.72968743970819, 73.09001725099304),
                    size: MarkerSize(width: 70, height: 70),
                    base64Marker: base64Image2
                ),
                Marker(
                    latLng: LatLng(33.72208282119375, 73.09542295847615),
                    base64Marker: base64Image3
                ),
                Marker(
                    latLng: LatLng(33.73214836197533, 73.06687654459805),
                    size: MarkerSize(width: 90, height: 90),
                    base64Marker: base64Image1,
                    infoWindow: InfoWindow(
                        title: "Demo title",
                        description: "This is Demo Description")
                ),
              ],
            ),
          )

Adding Circles

Container(
            child: TplMapsView(
              isZoomEnabled: true,
              mapMode: MapMode.DEFAULT,
              allGesturesEnabled: true,
              circles: [
                Circle(
                    latLng: LatLng(33.723149149167504,73.06167650992974),
                    radius: 1000,
                    color: "#FF0000"
                ),
              ],
            ),
          )

Adding Circles

Container(
            child: TplMapsView(
              isZoomEnabled: true,
              mapMode: MapMode.DEFAULT,
              allGesturesEnabled: true,
              circles: [
                Circle(
                    latLng: LatLng(33.723149149167504,73.06167650992974),
                    radius: 1000,
                    color: "#FF0000"
                ),
              ],
            ),
          )

Create Route

Container(
            child: TplMapsView(
              isZoomEnabled: true,
              mapMode: MapMode.DEFAULT,
              allGesturesEnabled: true,
              polyLine: Polyline(
                startLatLng: LatLng(33.71210524028265,73.05779999610466),
                endLatLng: LatLng(33.68816353784396,72.98338785144722),
                color: "#FFF000",
                width: 5,
                apiKey: myKey,
              ),
            ),
          )

Add Polygon

Container(
            child: TplMapsView(
              isZoomEnabled: true,
              mapMode: MapMode.DEFAULT,
              allGesturesEnabled: true,
              polygon: Polygon(coordinates: [
                LatLng(73.07824953648002, 33.735870643214774),
                LatLng(73.07500992070422, 33.736504540028584),
                LatLng(73.07424773695865, 33.73390100779751),
                LatLng(73.08020704883475, 33.73236925579299),
                LatLng(73.07457476129804, 33.73022716672756),
                LatLng(73.08081375969778, 33.72709474879913),
                LatLng(73.08962864042788, 33.73553948921669),
              ], color: "#000000", outerLineWidth: 10, isClickable: false),
            ),
          )

Add PolyLine Via latLng List

Container(
            child: TplMapsView(
              isZoomEnabled: true,
              mapMode: MapMode.DEFAULT,
              allGesturesEnabled: true,
              polyLines: [
                LatLng(73.07824953648002, 33.735870643214774),
                LatLng(73.07500992070422, 33.736504540028584),
                LatLng(73.07424773695865, 33.73390100779751),
                LatLng(73.08020704883475, 33.73236925579299),
                LatLng(73.07457476129804, 33.73022716672756),
                LatLng(73.08081375969778, 33.72709474879913),
                LatLng(73.08962864042788, 33.73553948921669),
              ],
            ),
          )

Contributing

Please report your issues and bugs on [e-mail]

License

MIT