मार्कर के साथ मैप जोड़ना

इस ट्यूटोरियल में, अपने iOS ऐप्लिकेशन में मार्कर के साथ Google मैप जोड़ने का तरीका बताया गया है. यह ट्यूटोरियल, Swift या Objective-C की शुरुआती या इंटरमीडिएट लेवल की जानकारी रखने वाले लोगों के लिए है. साथ ही, इसमें Xcode की सामान्य जानकारी भी शामिल है. मैप बनाने के बारे में ज़्यादा जानकारी पाने के लिए, डेवलपर गाइड पढ़ें.

इस ट्यूटोरियल की मदद से, यह मैप बनाया जाएगा. मार्कर को ऑस्ट्रेलिया के सिडनी शहर में रखा गया है.

सिडनी के ऊपर मार्कर के साथ मैप दिखाने वाला स्क्रीनशॉट

कोड प्राप्त करें

GitHub पर, Google Maps iOS के सैंपल की रिपॉज़िटरी को क्लोन करें या डाउनलोड करें.

इसके अलावा, सोर्स कोड डाउनलोड करने के लिए, इस बटन पर क्लिक करें:

मुझे कोड दें

Swift

import UIKit
import GoogleMaps

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
        // Create a GMSCameraPosition that tells the map to display the
        // coordinate -33.86,151.20 at zoom level 6.
        let camera = GMSCameraPosition.camera(withLatitude: -33.86, longitude: 151.20, zoom: 6.0)
        let options = GMSMapViewOptions()
        options.camera = camera
        options.frame = self.view.frame
        let mapView = GMSMapView(options: options)
        self.view.addSubview(mapView)

        // Creates a marker in the center of the map.
        let marker = GMSMarker()
        marker.position = CLLocationCoordinate2D(latitude: -33.86, longitude: 151.20)
        marker.title = "Sydney"
        marker.snippet = "Australia"
        marker.map = mapView
  }
}

Objective-C

#import "ViewController.h"
#import <GoogleMaps/GoogleMaps.h>

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
  // Do any additional setup after loading the view.
  // Create a GMSCameraPosition that tells the map to display the
  // coordinate -33.86,151.20 at zoom level 6.
  GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:-33.86
                                                          longitude:151.20
                                                               zoom:6];
  GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
  options.camera = camera;
  options.frame = self.view.frame;
  GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];
  mapView.myLocationEnabled = YES;
  [self.view addSubview:mapView];

  // Creates a marker in the center of the map.
  GMSMarker *marker = [[GMSMarker alloc] init];
  marker.position = CLLocationCoordinate2DMake(-33.86, 151.20);
  marker.title = @"Sydney";
  marker.snippet = @"Australia";
  marker.map = mapView;
}

@end

शुरू करें

Swift Package Manager

iOS के लिए Maps SDK को Swift Package Manager का इस्तेमाल करके इंस्टॉल किया जा सकता है.

  1. iOS के लिए Maps SDK की मौजूदा डिपेंडेंसी हटाएं.
  2. टर्मिनल विंडो खोलें और tutorials/map-with-marker डायरेक्ट्री पर जाएं.
  3. Xcode के वर्कस्पेस को बंद करें और ये कमांड चलाएं: 
    sudo gem install cocoapods-deintegrate cocoapods-clean
pod deintegrate
pod cache clean --all
rm Podfile
rm map-with-marker.xcworkspace
  4. Xcode प्रोजेक्ट खोलें और podfile मिटाएं.
  5. फ़ाइल > पैकेज की डिपेंडेंसी जोड़ें पर जाएं.
  6. यूआरएल के तौर पर https://github.com/googlemaps/ios-maps-sdk डालें. इसके बाद, पैकेज को पुल करने के लिए Enter दबाएं और पैकेज जोड़ें पर क्लिक करें.
  7. आपको फ़ाइल > पैकेज > पैकेज का कैश रीसेट करें का इस्तेमाल करके, पैकेज का कैश रीसेट करना पड़ सकता है.

एपीआई पासकोड पाना और ज़रूरी एपीआई चालू करना

इस ट्यूटोरियल को पूरा करने के लिए, आपको Google API पासकोड की ज़रूरत होगी. इस पासकोड के पास, iOS के लिए Maps SDK का इस्तेमाल करने की अनुमति होनी चाहिए. पासकोड पाने और एपीआई को चालू करने के लिए, इस बटन पर क्लिक करें.

शुरू करें

ज़्यादा जानकारी के लिए, एपीआई पासकोड पाना लेख पढ़ें.

अपने ऐप्लिकेशन में एपीआई पासकोड जोड़ना

अपना एपीआई पासकोड, AppDelegate.swift में इस तरह जोड़ें:

  1. ध्यान दें कि फ़ाइल में, इंपोर्ट करने का यह स्टेटमेंट जोड़ा गया है: 
    import GoogleMaps
  2. अपने application(_:didFinishLaunchingWithOptions:) तरीके में, इस लाइन को बदलें. इसमें YOUR_API_KEY को अपने एपीआई पासकोड से बदलें: 
    GMSServices.provideAPIKey("YOUR_API_KEY")

अपना ऐप्लिकेशन बनाना और उसे चलाना

  1. अपने कंप्यूटर से कोई iOS डिवाइस कनेक्ट करें या Xcode स्कीम मेन्यू से कोई सिम्युलेटर चुनें.
  2. अगर किसी डिवाइस का इस्तेमाल किया जा रहा है, तो पक्का करें कि जगह की जानकारी वाली सेवाएं चालू हों. अगर किसी सिम्युलेटर का इस्तेमाल किया जा रहा है, तो सुविधाएं मेन्यू से कोई जगह चुनें.
  3. Xcode में, प्रॉडक्ट/चलाएं मेन्यू के विकल्प (या चलाएं बटन के आइकॉन) पर क्लिक करें.
    • Xcode, ऐप्लिकेशन बनाता है. इसके बाद, ऐप्लिकेशन को डिवाइस या सिम्युलेटर पर चलाता है.
    • आपको ऑस्ट्रेलिया के पूर्वी तट पर सिडनी के बीच में एक मार्कर वाला मैप दिखेगा. यह इस पेज पर मौजूद इमेज जैसा होगा.

समस्या का हल:

  • अगर आपको कोई मैप नहीं दिखता है, तो पक्का करें कि आपने एपीआई पासकोड हासिल कर लिया हो और उसे ऐप्लिकेशन में जोड़ दिया हो . इसके बारे में पहले बताया जा चुका है. एपीआई पासकोड के बारे में गड़बड़ी के मैसेज के लिए, Xcode का डीबग करने वाला कंसोल देखें.
  • अगर आपने iOS बंडल आइडेंटिफ़ायर के हिसाब से एपीआई पासकोड पर पाबंदी लगाई है, तो ऐप्लिकेशन के लिए बंडल आइडेंटिफ़ायर जोड़ने के लिए, पासकोड में बदलाव करें: com.google.examples.map-with-marker.
  • पक्का करें कि आपके पास वाई-फ़ाई या जीपीएस का अच्छा कनेक्शन हो.
  • लॉग देखने और ऐप्लिकेशन को डीबग करने के लिए, Xcode के डीबग करने वाले टूल इस्तेमाल करें.

कोड को समझना

  1. एक मैप बनाएं और उसे viewDidLoad() में व्यू के तौर पर सेट करें.

    Swift

    // Create a GMSCameraPosition that tells the map to display the
// coordinate -33.86,151.20 at zoom level 6.
let camera = GMSCameraPosition.camera(withLatitude: -33.86, longitude: 151.20, zoom: 6.0)
let options = GMSMapViewOptions()
options.camera = camera
let mapView = GMSMapView(options: options)
view = mapView

    Objective-C

    // Create a GMSCameraPosition that tells the map to display the
// coordinate -33.86,151.20 at zoom level 6.
GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:-33.86
                                                        longitude:151.20
                                                             zoom:6.0];
GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
options.camera = camera;
GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];
self.view = mapView;
  2. viewDidLoad() में मैप में एक मार्कर जोड़ें.

    Swift

    // Creates a marker in the center of the map.
let marker = GMSMarker()
marker.position = CLLocationCoordinate2D(latitude: -33.86, longitude: 151.20)
marker.title = "Sydney"
marker.snippet = "Australia"
marker.map = mapView

    Objective-C

    // Creates a marker in the center of the map.
GMSMarker *marker = [[GMSMarker alloc] init];
marker.position = CLLocationCoordinate2DMake(-33.86, 151.20);
marker.title = @"Sydney";
marker.snippet = @"Australia";
marker.map = mapView;

डिफ़ॉल्ट रूप से, iOS के लिए Maps SDK, उपयोगकर्ता के मार्कर पर टैप करने पर, जानकारी वाली विंडो का कॉन्टेंट दिखाता है. अगर आपको डिफ़ॉल्ट व्यवहार से कोई समस्या नहीं है, तो मार्कर के लिए क्लिक लिसनर जोड़ने की ज़रूरत नहीं है.

बधाई हो! आपने एक iOS ऐप्लिकेशन बनाया है. यह ऐप्लिकेशन, किसी खास जगह को दिखाने के लिए मार्कर के साथ Google मैप दिखाता है. आपने iOS के लिए Maps SDK का इस्तेमाल करने का तरीका भी सीखा है.

अगले चरण

मैप ऑब्जेक्ट के बारे में ज़्यादा जानें. साथ ही, मार्कर की मदद से क्या किया जा सकता है, यह भी जानें.