কিভাবে মানচিত্র আইডি তৈরি করতে হয়

ম্যাপ আইডি হলো একটি অনন্য শনাক্তকারী যা গুগল ক্লাউডে সংরক্ষিত গুগল ম্যাপের স্টাইলিং এবং কনফিগারেশন সেটিংসকে প্রতিনিধিত্ব করে। আপনি আপনার ওয়েবসাইট এবং অ্যাপ্লিকেশনগুলিতে বিভিন্ন ফিচার চালু করতে, অথবা ম্যাপ পরিচালনা বা স্টাইল করতে ম্যাপ আইডি ব্যবহার করেন। আপনার গুগল ক্লাউড কনসোল প্রজেক্টের ম্যাপ ম্যানেজমেন্ট পেজে, আপনি আপনার প্রয়োজনীয় প্রতিটি প্ল্যাটফর্মের—যেমন জাভাস্ক্রিপ্ট, অ্যান্ড্রয়েড, আইওএস, বা স্ট্যাটিক ম্যাপ—জন্য ম্যাপ আইডি তৈরি করতে পারেন।

ম্যাপ আইডি ব্যবহৃত হয় এমন আরও বিস্তারিত তথ্য ও বৈশিষ্ট্য জানতে, ম্যাপ আইডি ওভারভিউ দেখুন।

প্রয়োজনীয় অনুমতি

আপনার প্রোজেক্টে যেকোনো ম্যাপ আইডি তৈরি বা পরিচালনা করতে, আপনাকে অবশ্যই প্রোজেক্টের ক্লাউড কনসোল IAM পৃষ্ঠায় উপযুক্ত ভূমিকা-স্তরের অনুমতি, যেমন এডিটর বা ওনার, সহ একজন প্রিন্সিপাল ব্যবহার করতে হবে। বিস্তারিত জানার জন্য, IAM বেসিক এবং প্রিডিফাইন্ড রোল রেফারেন্স দেখুন।

মানচিত্র আইডি তৈরি করুন

এই ধাপগুলো অনুসরণ করে ক্লাউড কনসোলে ম্যাপ আইডি তৈরি করুন:

  1. প্রয়োজনীয় অনুমতিসহ একটি ক্লাউড কনসোল প্রজেক্টে সাইন ইন করে সেটি খুলুন।

  2. ক্লাউড কনসোলে, ম্যাপস ম্যানেজমেন্ট পেজে যান।

  3. ম্যাপ আইডি তৈরি করুন -এ ক্লিক করুন।

    নতুন ম্যাপ আইডি তৈরি করুন

  4. নতুন ম্যাপ আইডি তৈরি করার পেজে, নিম্নলিখিত কাজগুলো করুন:

    1. Name- এর জন্য, ম্যাপ আইডিটির একটি নাম দিন।
    2. ঐচ্ছিক : বিবরণের জন্য, ম্যাপ আইডিটি কী কাজে ব্যবহৃত হয় তা বর্ণনা করুন।
    3. ম্যাপ টাইপের জন্য, সেই প্ল্যাটফর্মটি নির্বাচন করুন যেখানে আপনি ম্যাপ আইডিটি ব্যবহার করার পরিকল্পনা করছেন। আপনি যদি জাভাস্ক্রিপ্ট বেছে নেন, তাহলে একটি রাস্টার (ডিফল্ট) বা ভেক্টর ম্যাপ টাইপও বেছে নিন। ভেক্টর ম্যাপ সম্পর্কে আরও তথ্যের জন্য, ভেক্টর ম্যাপস দেখুন।
    4. আপনার নতুন ম্যাপ আইডি দেখতে সেভ-এ ক্লিক করুন।

একটি ম্যাপ স্টাইলের সাথে একটি ম্যাপ আইডি সংযুক্ত করুন

আপনি যদি ক্লাউড-ভিত্তিক ম্যাপ স্টাইলিং ব্যবহার করেন, তাহলে আপনার ম্যাপ আইডির সাথে একটি ম্যাপ স্টাইল যুক্ত করতে হবে। বিস্তারিত জানতে, ‘আপনার স্টাইলকে একটি ম্যাপ আইডির সাথে যুক্ত করুন ’ দেখুন।

আপনার অ্যাপে ম্যাপ আইডি যোগ করুন

অ্যান্ড্রয়েড

অ্যাক্টিভিটির লেআউট ফাইলে <fragment> এলিমেন্টের মাধ্যমে, MapView ক্লাস ব্যবহার করে, অথবা প্রোগ্রাম্যাটিকভাবে GoogleMapOptions ক্লাস ব্যবহার করে আপনার ম্যাপ আইডি যোগ করুন।

উদাহরণস্বরূপ, ধরে নিন আপনি একটি ম্যাপ আইডি তৈরি করেছেন যা res/values/strings.xml ফাইলে map_id নামের একটি স্ট্রিং ভ্যালু হিসেবে সংরক্ষিত আছে:

<?xml version="1.0" encoding="utf-8"?>
<resources>
<string name="map_id">MAP_ID</string>
</resources>

অ্যাক্টিভিটির লেআউট ফাইলে <fragment> এলিমেন্টের মাধ্যমে যোগ করা ম্যাপের ক্ষেত্রে, যে সমস্ত ম্যাপ ফ্র্যাগমেন্টে কাস্টম স্টাইল থাকা উচিত, সেগুলিতে অবশ্যই map:mapId অ্যাট্রিবিউটে ম্যাপ আইডি উল্লেখ করতে হবে:

<fragment xmlns:map="http://schemas.android.com/apk/res-auto"
    map:name="com.google.android.gms.maps.SupportMapFragment"
        map:mapId="@string/map_id" />

আপনি MapView ক্লাসের map:mapId অ্যাট্রিবিউট ব্যবহার করেও একটি ম্যাপ আইডি নির্দিষ্ট করতে পারেন:

<com.google.android.gms.maps.MapView
    xmlns:map="http://schemas.android.com/apk/res-auto"
    ....
    map:mapId="@string/map_id" />

প্রোগ্রাম্যাটিকভাবে একটি ম্যাপ আইডি নির্দিষ্ট করতে, GoogleMapOptions ক্লাস ব্যবহার করে এটিকে একটি MapFragment ইনস্ট্যান্সে পাস করুন:

জাভা

 MapFragment mapFragment = MapFragment.newInstance(
     new GoogleMapOptions()
         .mapId(getResources().getString(R.string.map_id)));

কোটলিন

 val mapFragment = MapFragment.newInstance(
     GoogleMapOptions()
         .mapId(resources.getString(R.string.map_id))
 )

অ্যান্ড্রয়েড স্টুডিওতে, আপনি স্বাভাবিকভাবে যেভাবে করেন সেভাবে আপনার অ্যাপটি বিল্ড ও রান করুন। প্রথম ধাপে কনফিগার করা কাস্টম স্টাইলগুলো নির্দিষ্ট ম্যাপ আইডিযুক্ত সমস্ত ম্যাপে প্রয়োগ করা হবে।

অ্যান্ড্রয়েড 3D

প্রোগ্রাম্যাটিকভাবে অথবা লেআউট অ্যাট্রিবিউট ব্যবহার করে Map3DOptionsmapId স্ট্রিং প্রপার্টিটি সেট করুন। Map3DOptions ইনস্ট্যানসিয়েশনের সময় Map3DView অবজেক্টে সরবরাহ করা হয় এবং Map3DView তৈরি হয়ে যাওয়ার পর তা আর পরিবর্তন করা যায় না।

ডেভেলপাররা চাইলে একটি নতুন OnMapIdErrorListener প্রয়োগ করতে পারেন, যার মাধ্যমে কোনো অবৈধ বা খুঁজে না পাওয়া ম্যাপ আইডি সম্পর্কে অবহিত হওয়া যায় এবং সেই অনুযায়ী ব্যবস্থা নেওয়া যায়।

প্রোগ্রাম্যাটিকভাবে ম্যাপ তৈরি করার সময় একটি ম্যাপ আইডি যোগ করুন এবং একটি OnMapIdErrorListener সেট করুন:

import com.google.android.gms.maps3d.GoogleMap3D
import com.google.android.gms.maps3d.Map3DOptions
import com.google.android.gms.maps3d.Map3DView
import com.google.android.gms.maps3d.OnMap3DViewReadyCallback
import com.google.android.gms.maps3d.model.Map3DMode

class MainActivity : Activity(), OnMap3DViewReadyCallback, OnMapIdError {
  fun onCreate(...) {
    val map3DOptions = Map3DOptions(mapMode = Map3DMode.HYBRID, mapId = "MAP_ID")
    val map3DView = Map3DView(context, map3DOptions)
    map3DView.getMap3dViewAsync(this)
  }

  override fun onMap3DViewReady(googleMap3D: GoogleMap3D) {
    googleMap3D.setMapIdErrorListener(
      object : OnMapIdErrorListener {
        override fun onMapIdError() {
          // Handle error event.
        }
      }
    )
  }
}

লেআউট অ্যাট্রিবিউট ব্যবহার করে একটি ম্যাপ আইডি যোগ করুন:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
   xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:map3d="http://schemas.android.com/apk/res-auto"
   android:layout_width="match_parent" android:layout_height="match_parent">
 <com.google.android.gms.maps3d.Map3DView
     android:id="@+id/map3dView"
     android:layout_width="fill_parent"
     android:layout_height="fill_parent"
     map3d:mode="hybrid"
     map3d:mapId="MAP_ID"/>
</LinearLayout>

আইওএস

ম্যাপ আইডি ব্যবহার করে একটি ম্যাপ ইনস্ট্যানশিয়েট করতে, নিম্নলিখিতগুলি করুন:

  1. ক্লাউড কনসোল থেকে ম্যাপ আইডি স্ট্রিং ব্যবহার করে একটি GMSMapID তৈরি করুন।
  2. আপনার এইমাত্র তৈরি করা ম্যাপ আইডিটি উল্লেখ করে একটি GMSMapView তৈরি করুন।

সুইফট

let camera = GMSCameraPosition(latitude: 47.0169, longitude: -122.336471, zoom: 12)
let mapID = GMSMapID(identifier: "MAP_ID")
let mapView = GMSMapView(frame: .zero, mapID: mapID, camera: camera)
self.view = mapView

উদ্দেশ্য-সি

GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:47.0169
                                                        longitude:-122.336471
                                                             zoom:12];
GMSMapID *mapID = [GMSMapID mapIDWithIdentifier:@"MAP_ID"];
GMSMapView *mapView = [GMSMapView mapWithFrame:CGRectZero mapID:mapID camera:camera];
self.view = mapView;

আপনি যদি আপনার নিজস্ব ম্যাপ আইডি ব্যবহার করেন, তাহলে যেকোনো সময় ক্লাউড কনসোলে আপনার ম্যাপ আইডি সেট করে একটি নতুন স্টাইল যোগ করতে পারেন, এবং সেই স্টাইলটি প্রায় ছয় ঘণ্টার মধ্যে আপনার ও ব্যবহারকারীদের জন্য ম্যাপ ভিউতে স্বয়ংক্রিয়ভাবে প্রতিফলিত হবে।

আপনি যদি পরিবর্তনগুলো সঙ্গে সঙ্গে দেখতে চান, তাহলে অ্যাপটি বন্ধ করে আবার চালু করতে পারেন। এর জন্য, সম্প্রতি ব্যবহৃত অ্যাপের তালিকা থেকে অ্যাপটিকে জোর করে বন্ধ করুন এবং তারপর পুনরায় খুলুন। এরপর আপডেট করা মানচিত্রটি দেখা যাবে।

আইওএস 3D

iOS ডেভেলপাররা Map উপর একটি নতুন style মডিফায়ার সেট করতে পারেন। এই মডিফায়ারটি একটি ম্যাপ আইডি এবং ঐচ্ছিকভাবে একটি ক্লোজার গ্রহণ করে, যা ম্যাপ আইডিটি অবৈধ বা খুঁজে না পাওয়া গেলে কল করা হয়।

import SwiftUI
import GoogleMaps3D

struct ContentView: View {
  init () {
    Map.apiKey = "YOUR_API_KEY"
  }
  var body: some View {
    Map(initialCamera: .init(
        latitude: 0.0,
        longitude: 0.0,
      ),
      mode: .hybrid
    )
    .style(
      with: "MAP_ID",
      error: {
        // Handle styling error.
      }
    )
    // Could also use trailing closure syntax
    //  .style(with: "MAP_ID") {
    //     // Handle styling error.
    //  }
  }
}

জাভাস্ক্রিপ্ট

আপনার অ্যাপ্লিকেশন কোডে একটি ম্যাপ আইডি দিয়ে ম্যাপ তৈরি করতে:

  1. আপনি যদি ইতিমধ্যেই এমবেডেড JSON কোড দিয়ে আপনার ম্যাপ কাস্টমাইজ করে থাকেন, তাহলে আপনার MapOptions অবজেক্ট থেকে styles প্রপার্টিটি সরিয়ে দিন; অন্যথায়, এই ধাপটি এড়িয়ে যান।

  2. mapId প্রপার্টি ব্যবহার করে ম্যাপে একটি ম্যাপ আইডি যোগ করুন। উদাহরণস্বরূপ:

map = new google.maps.Map(document.getElementById('map'), {
center: {lat: -34.397, lng: 150.644},
zoom: 8,
mapId: 'MAP_ID'
});

জাভাস্ক্রিপ্ট 3D

আপনার অ্যাপ্লিকেশনে ম্যাপ আইডি সহ একটি ম্যাপ তৈরি করতে, mapId প্রপার্টি ব্যবহার করে ম্যাপটিতে একটি ম্যাপ আইডি যোগ করুন। উদাহরণস্বরূপ:

async function init() {
    const { Map3DElement } = await google.maps.importLibrary('maps3d');

    const map = new Map3DElement({
        center: {
            lat: 37.75183154601466,
            lng: -119.52369070507672,
            altitude: 2200,
        },
        tilt: 67.5,
        heading: 108.94057782079429,
        range: 6605.57279990986,
        mapId: 'bcce776b92de1336e22c569f', // Styles are associated with map IDs.
        mode: 'HYBRID',
    });

    document.body.append(map);
}

void init();

মানচিত্র স্থির

আমাদের ওয়েব-সার্ভিস এপিআইগুলোর কোনো একটি ব্যবহার করে এমন নতুন বা বিদ্যমান কোনো ম্যাপে ম্যাপ আইডি যোগ করতে, map_id ইউআরএল প্যারামিটারটি যুক্ত করুন এবং এটিকে আপনার ম্যাপ আইডিতে সেট করুন। এই উদাহরণটিতে ম্যাপস স্ট্যাটিক এপিআই ব্যবহার করে একটি ম্যাপে ম্যাপ আইডি যোগ করার পদ্ধতি দেখানো হয়েছে।

<img src="https://maps.googleapis.com/maps/api/staticmap?center=Brooklyn+Bridge,New+York,NY&zoom=13&size=600x300&maptype=roadmap&markers=color:blue%7Clabel:S%7C40.702147,-74.015794&markers=color:green%7Clabel:G%7C40.711614,-74.012318&markers=color:red%7Clabel:C%7C40.718217,-73.998284&key=YOUR_API_KEY&map_id=MAP_ID&signature=YOUR_SIGNATURE" />

মার্কিন যুক্তরাষ্ট্রের নিউ ইয়র্ক সিটির ব্রুকলিন ব্রিজকে কেন্দ্র করে একটি মানচিত্র, যার নিচের ডান কোণায় মানচিত্র নিয়ন্ত্রণের ব্যবস্থা রয়েছে। মানচিত্রটিতে রাস্তা, জল এবং ভূমিতে নিজস্ব শৈলী প্রদর্শন করা হয়েছে।

আপনার ম্যাপ আইডি যোগ করার আগে যদি আপনার ম্যাপস স্ট্যাটিক ইউআরএল-এ কোনো ডিজিটাল স্বাক্ষর থাকে, তাহলে ম্যাপ আইডি যোগ করার পরে আপনাকে একটি নতুন ডিজিটাল স্বাক্ষর তৈরি করে যোগ করতে হবে। আপনার নতুন ইউআরএল সাইনিং সিক্রেট তৈরি করার সময়, ইউআরএল থেকে আপনার পূর্ববর্তী ডিজিটাল স্বাক্ষরটি মুছে ফেলতে মনে রাখবেন।