MapmyIndia Android SDK — добавление полилиний на карту

Опубликовано: 22 Февраля, 2023

Много раз в приложении для Android, которое отображает карты в своем приложении для Android, мы можем видеть карты, а также отображать полилинии на картах. В этой статье мы рассмотрим, как добавить полилинии на карту с помощью Map My India SDK в Android.

Note: This Android article covered in both Java and Kotlin languages. 

Пошаговая реализация

Шаг 1. Создайте новый проект в Android Studio.

Чтобы создать новый проект в Android Studio, обратитесь к разделу «Как создать/запустить новый проект в Android Studio ».

Шаг 2. Загрузка SDK для Map My India

Перейдите по ссылке и загрузите jar-файл для Map My India SDK. После загрузки скопируйте файл, чтобы добавить его в наш проект. Перейдите в раздел «Проект» в проекте Android Studio. Затем перейдите в «Имя проекта»> «Приложение»> «Библиотеки». Щелкните его правой кнопкой мыши и просто вставьте загруженный файл jar в эту папку.

Шаг 3: Добавление зависимости в файл build.gradle

Перейдите к файлу app > build.gradle и добавьте к нему приведенную ниже зависимость в разделе зависимостей.

implementation "com.google.code.gson:gson:2.3"
implementation files("libs/map_sdk_2.1.jar")

После добавления зависимости просто синхронизируйте свой проект.

Шаг 4: Работа с файлом activity_main.xml

Перейдите к app > res > layout > activity_main.xml и добавьте в него приведенный ниже код. В код добавлены комментарии для более подробного ознакомления.

XML




<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
  
    <!--on below line we are creating a map view-->
    <com.mmi.MapmyIndiaMapView
        android:id="@+id/idMapView"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
  
</RelativeLayout>

Шаг 5. Добавление разрешений в файл AndroidManifest.xml

Перейдите к файлу app>AndroidManifest.xml и добавьте к нему указанные ниже разрешения.

XML




<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />

Теперь добавьте приведенный ниже код в тег приложения в файле AndroidManifest.xml, чтобы использовать устаревшую библиотеку в нашем приложении.

XML




<uses-library
  android:name="org.apache.http.legacy"
  android:required="false" />

Шаг 6. Создание ключа API для использования Map My India SDK.

Перейдите по ссылке. Зарегистрируйтесь, указав свой адрес электронной почты и пароль, и вы увидите экран ниже. Внутри этого перейдите на вкладку учетных данных, чтобы увидеть свой ключ API. Скопируйте этот ключ API, который мы должны использовать в нашем проекте.

Шаг 7: Работа с файлом MainActivity

Перейдите к приложению > java > имени пакета вашего приложения > файлу MainActivity и добавьте в него приведенный ниже код. В код добавлены комментарии для более подробного ознакомления.

Kotlin




package com.gtappdevelopers.mapmyindiakotlin
  
import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import com.mmi.LicenceManager
import com.mmi.MapmyIndiaMapView
import com.mmi.layers.Marker
import com.mmi.layers.PathOverlay
import com.mmi.util.GeoPoint
import java.util.*
  
class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        // on below line we are setting rest api key and map sdk key.
        LicenceManager.getInstance().restAPIKey = "Enter API key"
        LicenceManager.getInstance().mapSDKKey = "Enter your API key"
        // on below line we are creating variables for map view and initializing it.
        val mapmyIndiaMapView = findViewById<MapmyIndiaMapView>(R.id.idMapView)
        // on below line we are getting our map view.
        val mapView = mapmyIndiaMapView.mapView
        // on below line we are creating an array list
        // to display all markers.
        val geoPoints = ArrayList<GeoPoint>()
        // on below line adding marker geo point to our list.
        geoPoints.add(GeoPoint(28.549356, 77.26780099999999))
        geoPoints.add(GeoPoint(28.551844, 77.26749))
        geoPoints.add(GeoPoint(28.554454, 77.265473))
        geoPoints.add(GeoPoint(28.549637999999998, 77.262909))
        // on below line we are running loop to display marker
        for (i in geoPoints) {
            // on below line we are creating our marker.
            val marker = Marker(mapView)
            // on below line we are setting marker position.
            marker.position = i
            // on below line we are adding anchor for our marker.
            marker.setAnchor(Marker.ANCHOR_CENTER, Marker.ANCHOR_CENTER)
            // on below line we are adding our marker to map view.
            mapView.overlays.add(marker)
        }
        // on below line we are creating a path
        // overlay to add a polyline.
        val pathOverlay = PathOverlay(this)
        // on below line we are setting color for polyline.
        pathOverlay.color = resources.getColor(R.color.purple_200)
        // on below line we are setting width of polyline
        pathOverlay.width = 10f
        // on below line we are setting points on 
        // which we have to display poly line.
        pathOverlay.points = geoPoints
        // on below line we are setting 
        // bounds for map view.
        mapView.setBounds(geoPoints)
        // on below line we are adding path overlay.
        mapView.overlays.add(pathOverlay)
        mapView.invalidate()
    }
}

Java




package com.gtappdevelopers.mapmyindia;
  
import android.os.Bundle;
  
import androidx.appcompat.app.AppCompatActivity;
  
import com.mmi.LicenceManager;
import com.mmi.MapView;
import com.mmi.MapmyIndiaMapView;
import com.mmi.layers.Marker;
import com.mmi.layers.PathOverlay;
import com.mmi.util.GeoPoint;
  
import java.util.ArrayList;
  
public class MainActivity extends AppCompatActivity {
  
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        // on below line we are setting rest api key and map sdk key.
        LicenceManager.getInstance().setRestAPIKey("Enter your API key");
        LicenceManager.getInstance().setMapSDKKey("Enter your API key");
        // on below line we are creating variables for map view and initializing it.
        MapmyIndiaMapView mapmyIndiaMapView = findViewById(R.id.idMapView);
        // on below line we are getting our map view.
        MapView mapView = mapmyIndiaMapView.getMapView();
        // on below line we are creating an array list 
        // to display all markers.
        ArrayList<GeoPoint> geoPoints = new ArrayList<>();
        // on below line adding marker geo point to our list.
        geoPoints.add(new GeoPoint(28.549356, 77.26780099999999));
        geoPoints.add(new GeoPoint(28.551844, 77.26749));
        geoPoints.add(new GeoPoint(28.554454, 77.265473));
        geoPoints.add(new GeoPoint(28.549637999999998, 77.262909));
        // on below line we are running loop to display marker
        for (int i = 0; i < geoPoints.size(); i++) {
            // on below line we are creating our marker.
            Marker marker = new Marker(mapView);
            // on below line we are setting marker position.
            marker.setPosition(geoPoints.get(i));
            // on below line we are adding anchor for our marker.
            marker.setAnchor(Marker.ANCHOR_CENTER, Marker.ANCHOR_CENTER);
            // on below line we are adding our marker to map view.
            mapView.getOverlays().add(marker);
        }
        // on below line we are creating a path overlay to add a polyline.
        PathOverlay pathOverlay = new PathOverlay(this);
        // on below line we are setting color for polyline.
        pathOverlay.setColor(getResources().getColor(R.color.purple_200));
        // on below line we are setting width of polyline
        pathOverlay.setWidth(10);
        // on below line we are setting points on 
        // which we have to display poly line.
        pathOverlay.setPoints(geoPoints);
        // on below line we are setting
        // bounds for map view.
        mapView.setBounds(geoPoints);
        // on below line we are adding path overlay.
        mapView.getOverlays().add(pathOverlay);
        mapView.invalidate();
  
    }
}

Теперь запустите ваше приложение, чтобы увидеть результат.

Выход: