আপনার অ্যাপে 3D ম্যাপ যোগ করা

প্ল্যাটফর্ম বেছে নিন: Android iOS JavaScript

Android-এর জন্য Maps 3D SDK ব্যবহার করে কীভাবে Android অ্যাপে একটি বেসিক 3D ম্যাপ যোগ করতে হয়, এই পৃষ্ঠায় তার একটি উদাহরণ দেওয়া হয়েছে। এই পৃষ্ঠায় দেওয়া নির্দেশাবলী ধরে নেয় যে আপনি আগেই সেট-আপ পৃষ্ঠায় দেওয়া ধাপগুলি সম্পূর্ণ করেছেন এবং আপনার কাছে নিম্নলিখিতগুলি আছে:

• Android-এর জন্য Maps 3D SDK চালু করা আছে এমন Google Cloud প্রোজেক্ট
• Android-এর জন্য Maps 3D SDK-এর সাথে ব্যবহার করার জন্য কনফিগার করা একটি API কী
• Android-এর জন্য Maps 3D SDK-এর সাথে ব্যবহার করার জন্য সেট-আপ করা একটি Android Studio প্রোজেক্ট

এইসব পূর্বশর্ত সম্পর্কে আরও জানতে, সেট-আপ দেখুন।

পার্ট ১: Map3DView কম্পোনেন্ট যোগ করতে লেআউট ফাইল (activity_main.xml) আপডেট করুন

Map3DView কম্পোনেন্ট হল সেই ভিউ যা অ্যাপের মধ্যে 3D ম্যাপ রেন্ডার করে। নিম্নলিখিত ধাপগুলি কম্পোনেন্ট যোগ করে এবং ক্যামেরার পজিশন ও সম্পর্কিত অ্যাট্রিবিউট সহ ম্যাপের প্রাথমিক অবস্থা কনফিগার করে:

মনে রাখবেন: এই বিভাগে দেওয়া ধাপগুলি ধরে নেয় যে আপনি সেট-আপ-এ বর্ণিত প্রসেস ব্যবহার করে আপনার Android Studio প্রোজেক্ট তৈরি ও কনফিগার করেছেন অথবা আপনি কোনও বিদ্যমান প্রোজেক্টে নতুন View অ্যাক্টিভিটি যোগ করেছেন। আপনি যদি কোনও ভিউ অ্যাক্টিভিটি যোগ না করে নতুন Android Studio প্রোজেক্ট তৈরি করেন, তাহলে আপনার প্রোজেক্টে activity_main.xml ফাইল থাকবে না।

1. আপনার প্রধান অ্যাক্টিভিটির লেআউট ফাইল খুলুন, যা সাধারণত app/src/main/res/layout/activity_main.xml-এ থাকে।

2. রুট ConstraintLayout (বা আপনার রুট লেআউট এলিমেন্ট)-এ, map3d XML নেমস্পেস যোগ করুন:

   xmlns:map3d="http://schemas.android.com/apk/res-auto"
   

3. "Hello World!" দেখায় এমন ডিফল্ট <TextView> মুছে দিন।

4. আপনার লেআউটে Map3DView কম্পোনেন্ট যোগ করুন। আপনি ক্যামেরার পজিশন ও অন্যান্য অ্যাট্রিবিউট কাস্টমাইজ করতে পারবেন:

   <?xml version="1.0" encoding="utf-8"?>
   <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
     xmlns:map3d="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools"
     android:id="@+id/main"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     tools:context=".MainActivity">
   
     <com.google.android.gms.maps3d.Map3DView
       android:id="@+id/map3dView"
       android:layout_width="match_parent"
       android:layout_height="match_parent"
       map3d:mapMode="hybrid"
       map3d:centerLat="38.544012"
       map3d:centerLng="-107.670428"
       map3d:centerAlt="2427.6"
       map3d:heading="310"
       map3d:tilt="63"
       map3d:range="8266"
       map3d:roll="0"
       map3d:minAltitude="0"
       map3d:maxAltitude="1000000"
       map3d:minHeading="0"
       map3d:maxHeading="360"
       map3d:minTilt="0"
       map3d:maxTilt="90"
       app:layout_constraintBottom_toBottomOf="parent"
       app:layout_constraintEnd_toEndOf="parent"
       app:layout_constraintStart_toStartOf="parent"
       app:layout_constraintTop_toTopOf="parent" />
   </androidx.constraintlayout.widget.ConstraintLayout>
   

পার্ট ২: MainActivity.kt আপডেট করুন

নিম্নলিখিত ধাপগুলি পার্ট ১-এ activity_main.xml ফাইলে যোগ করা Map3DView কম্পোনেন্টকে ইনিশিয়ালাইজ করে এবং কম্পোনেন্ট লাইফসাইকেল ইভেন্ট ম্যানেজ করে।

মনে রাখবেন, Android-এর জন্য Maps 3D SDK একবারে শুধুমাত্র একটি অ্যাক্টিভ Map3DView ইনস্ট্যান্স সাপোর্ট করে। একই সাথে একাধিক Map3DView ইনস্ট্যান্স দেখানো (যেমন, একই লেআউটে বা বিভিন্ন দৃশ্যমান অ্যাক্টিভিটি বা ফ্র্যাগমেন্টে) সমর্থিত নয় এবং এর ফলে রেন্ডারিং সংক্রান্ত সমস্যা হতে পারে, যেমন সেকেন্ডারি ভিউতে কালো স্ক্রিন।

এছাড়াও, সব Map3DView একই ম্যাপ স্টেট শেয়ার ও রিফ্লেক্ট করবে (যেমন, ক্যামেরার পজিশন, যোগ করা মার্কার, বহুভুজ ইত্যাদি), যা একটি Map3DView ধ্বংস (onDestroy ব্যবহার করে) ও অন্য একটি তৈরি করা হলেও থেকে যাবে, যতক্ষণ না ম্যানুয়ালি মুছে দেওয়া হয়। যেমন, আপনি Map3DView1-এ মার্কার যোগ করার পরে সেটি মুছে দিয়ে Map3DView2 তৈরি করলে, Map3DView2-এ একই মার্কার উপস্থিত থাকবে।

ডেভেলপারের দায়িত্ব:

• একবারে একটি ভিউ: নিশ্চিত করুন যে যেকোনও মুহূর্তে আপনার ভিউ হায়ারার্কির অ্যাক্টিভ অংশে শুধুমাত্র একটি Map3DView আছে।
• ম্যানুয়ালি ক্লিন-আপ করা: একটি Map3DView (যেমন, Map3DView1) থেকে অন্যটিতে (যেমন, Map3DView2) পরিবর্তন করার সময়, আপনাকে অবশ্যই পুরনো ইনস্ট্যান্সে (Map3DView1) onDestroy() কল করতে হবে। কারণ, অন্তর্নিহিত ম্যাপ স্টেট শেয়ার করা হয়, তাই Map3DView2 যাতে ফ্রেশ বা নির্দিষ্ট স্টেট দিয়ে শুরু হয় তা নিশ্চিত করতে, Map3DView1-এর মাধ্যমে সেট করা যেকোনও স্টেট ম্যানুয়ালি মুছে ফেলার দায়িত্ব আপনার। এর মধ্যে মার্কার, ওভারলে ইত্যাদি সরানো এবং OnMap3DViewReadyCallback-এ পাওয়া GoogleMap3D অবজেক্ট ব্যবহার করে ক্যামেরা পজিশন রিসেট করা অন্তর্ভুক্ত।

1. আপনার MainActivity.kt ফাইল খুলুন, যা সাধারণত app/src/main/java/com/example/yourpackagename/MainActivity.kt-এ থাকে।

2. Android-এর জন্য Maps 3D SDK-এর জন্য প্রয়োজনীয় ইমপোর্ট যোগ করুন:

   import android.util.Log
   import com.google.android.gms.maps3d.GoogleMap3D
   import com.google.android.gms.maps3d.Map3DView
   import com.google.android.gms.maps3d.OnMap3DViewReadyCallback
   

3. OnMap3DViewReadyCallback প্রয়োগ করতে MainActivity ক্লাস পরিবর্তন করুন:

   class MainActivity : AppCompatActivity(), OnMap3DViewReadyCallback {
   

4. Map3DView ও GoogleMap3D-এর জন্য ভেরিয়েবল ঘোষণা করুন:

   private lateinit var map3DView: Map3DView
   private var googleMap3D: GoogleMap3D? = null
   

5. onCreate পদ্ধতিতে, setContentView(...) ও ViewCompat.setOnApplyWindowInsetsListener ব্লক করার পরে, map3DView ইনিশিয়ালাইজ করুন, এর onCreate লাইফসাইকেল পদ্ধতি কল করুন এবং অ্যাসিঙ্ক্রোনাসভাবে ম্যাপের অনুরোধ করুন:

   override fun onCreate(savedInstanceState: Bundle?) {
       super.onCreate(savedInstanceState)
       enableEdgeToEdge()
       setContentView(R.layout.activity_main)
       ViewCompat.setOnApplyWindowInsetsListener(findViewById(R.id.main)) { v, insets ->
           val systemBars = insets.getInsets(WindowInsetsCompat.Type.systemBars())
           v.setPadding(systemBars.left, systemBars.top, systemBars.right, systemBars.bottom)
           insets
       }
   
       map3DView = findViewById(R.id.map3dView)
       map3DView.onCreate(savedInstanceState)
       map3DView.getMap3DViewAsync(this)
   }
   

6. onMap3DViewReady ও onError পদ্ধতি ওভাররাইড করুন। এইসব কলব্যাক তখন ট্রিগার করা হয় যখন ম্যাপ ব্যবহারের জন্য রেডি হয়ে যায় অথবা ইনিশিয়ালাইজেশনের সময় কোনও সমস্যা হয়:

   override fun onMap3DViewReady(googleMap3D: GoogleMap3D) {
       // Interact with the googleMap3D object here
       this.googleMap3D = googleMap3D
       // You can now make calls to the googleMap3D object, e.g.,
       // googleMap3D.flyTo(camera { ... })
   }
   
   override fun onError(error: Exception) {
       // Handle the error gracefully here (for example, show an error dialog or log the error).
       Log.e("MainActivity", "Error loading 3D map", error)
   }
   

7. আপনার অ্যাক্টিভিটি থেকে Map3DView-এ লাইফসাইকেল ইভেন্ট ফরওয়ার্ড করতে, MainActivity-এ নিম্নলিখিত ওভাররাইড যোগ করুন:

   override fun onStart() {
       super.onStart()
       map3DView.onStart()
   }
   
   override fun onResume() {
       super.onResume()
       map3DView.onResume()
   }
   
   override fun onPause() {
       map3DView.onPause()
       super.onPause()
   }
   
   override fun onStop() {
       map3DView.onStop()
       super.onStop()
   }
   
   override fun onDestroy() {
       map3DView.onDestroy()
       super.onDestroy()
   }
   
   override fun onSaveInstanceState(outState: Bundle) {
       super.onSaveInstanceState(outState)
       map3DView.onSaveInstanceState(outState)
   }
   
   override fun onLowMemory() {
       super.onLowMemory()
       map3DView.onLowMemory()
   }
   

পার্ট ৩: Gradle সিঙ্ক ও রান করা

আপনি এখন অ্যাপের লেআউট ও অ্যাক্টিভিটি আপডেট করেছেন, তাই 3D ম্যাপ ভিউ দেখতে অ্যাপটি তৈরি ও রান করতে পারবেন।

1. Gradle-এর সাথে আপনার প্রোজেক্ট সিঙ্ক করতে, ফাইল > Gradle ফাইলের সাথে প্রোজেক্ট সিঙ্ক করুন বিকল্প বেছে নিন।

2. এমুলেটর বা ফিজিক্যাল ডিভাইসে আপনার অ্যাপ তৈরি ও রান করাতে, রান করান > রান করান বিকল্প বেছে নিন।

সবকিছু সঠিকভাবে কনফিগার করা থাকলে, আপনার অ্যাপে একটি 3D ম্যাপ দেখতে পাবেন, যা আপনার activity_main.xml-এ নির্দিষ্ট করা স্থানাঙ্কের কাছাকাছি কেন্দ্র করে থাকবে।

ম্যাপ লোডিং ও সমস্যা সংক্রান্ত স্ট্যাটাস

Maps 3D SDK for Android, ম্যাপের স্টেট ম্যানেজ করার সময় বিল্ট-ইন ভিজ্যুয়াল ফিডব্যাক অটোমেটিক দেখায়:

• লোডিং ওভারলে: ম্যাপ ভিউ প্রথমবার শুরু করার সময় বা প্রাথমিক ভিউপোর্ট লোড করার সময় মাঝখানে একটি প্রগ্রেস ইন্ডিকেটর দেখানো হয়।
• ওভারলে সংক্রান্ত সমস্যা: কোনও গুরুত্বপূর্ণ সমস্যা হলে, যেমন, ভুল API কী, নেটওয়ার্ক সংক্রান্ত সমস্যা অথবা কোনও কাজ করে না এমন ডিভাইসে রান করার সময়, স্টাইল করা সমস্যা কার্ড দেখানো হয়।

আপনি এইসব ইনিশিয়ালাইজেশন বা লোডিং সংক্রান্ত সমস্যা প্রোগ্র্যামাটিক উপায়ে ক্যাপচার করতে পারবেন, এর জন্য আপনার OnMap3DViewReadyCallback ইমপ্লিমেন্টেশনের মধ্যে onError(error: Exception) ওভাররাইড করতে হবে।

ম্যাপে ক্লিক ইভেন্ট শোনা

ম্যাপে ক্লিক ইভেন্ট শুনতে, GoogleMap3D-এ setMap3DClickListener কল করুন। ব্যবহারকারী ম্যাপে ক্লিক করলে, onMap3DClick কলব্যাক একটি Map3DClickEvent অবজেক্ট পায় যা ক্লিক করা পয়েন্টের location ও placeId প্রদান করে এবং একটি Boolean রিটার্ন করে (ডিফল্ট Places UI উইজেট লুকানোর জন্য true অথবা এটি দেখানোর জন্য false)। আরও তথ্যের জন্য, উল্লেখযোগ্য স্থানের সাথে ইন্টার‍্যাক্ট করুন।

ম্যাপ ক্লিক লিসনার কীভাবে সেট করতে হয় তা নিম্নলিখিত উদাহরণ থেকে জানতে পারবেন:

googleMap3D.setMap3DClickListener { event: Map3DClickEvent ->
    Log.d(
        "MainActivity",
        "Clicked at ${event.location}, placeId: ${event.placeId}"
    )
    false
}

মনে রাখবেন: ক্লিক লিসনার মূল UI থ্রেডে রান করে না। UI এলিমেন্ট আপডেট করার আগে মূল থ্রেডে পাল্টে নিন।

পরবর্তী ধাপ

আপনার অ্যাপে একটি প্রাথমিক 3D ম্যাপ যোগ করার পরে, আপনি Android-এর জন্য Maps 3D SDK-এর আরও উন্নত ফিচার এক্সপ্লোর করতে পারবেন, যেমন ক্যামেরা পাথ অ্যানিমেশন, 3D মার্কার বা বহুভুজ।