स्ट्रीट व्यू

प्लैटफ़ॉर्म चुनें: Android iOS JavaScript

Google Street View अपने कवरेज इलाके की तय सड़कों से पैनोरामा वाले 360-डिग्री व्यू दिखाता है.

इस वीडियो में दिखाया गया है कि कैसे Street View सेवा का इस्तेमाल करके, उपयोगकर्ताओं को मैप पर मौजूद किसी पते का असल अनुभव दिया जा सकता है. साथ ही, उन्हें मंज़िल या पसंदीदा जगह के बारे में सही जानकारी दी जा सकती है.

Google Maps के Android एपीआई v2 और आपके Android डिवाइस पर Google Maps ऐप्लिकेशन के लिए उपलब्ध कवरेज, एक जैसी ही होती है. Street View के बारे में जानकारी देने के लिए, इंटरैक्टिव मैप पर Street View के बारे में ज़्यादा पढ़ें और उन इलाकों को देखें जहां यह सुविधा उपलब्ध है.

StreetViewPanorama क्लास आपके ऐप्लिकेशन में Street View पैनोरामा को मॉडल करती है. आपके यूज़र इंटरफ़ेस (यूआई) में, पैनोरामा को StreetViewPanoramaFragment या StreetViewPanoramaView ऑब्जेक्ट से दिखाया जाता है.

कोड सैंपल

GitHub पर ApiDemos स्टोर करने की जगह में, ऐसे सैंपल शामिल हैं जो Street View के इस्तेमाल के बारे में बताते हैं.

Kotlin के सैंपल:

Java सैंपल:

Android के लिए Maps SDK में Street View की खास जानकारी

Android के लिए Maps SDK टूल, Google Street View में इस्तेमाल की गई तस्वीरें लेने और उनमें बदलाव करने के लिए Street View की सेवा देता है. इमेज को पैनोरामा के तौर पर दिखाया जाता है.

हर Street View पैनोरामा एक इमेज या इमेज का सेट होता है, जो एक ही जगह से पूरी तरह से 360-डिग्री व्यू दिखाता है. इमेज, इक्वीरेक्टैंग्युलर (प्लेट कारे) प्रोजेक्शन के मुताबिक होती हैं, जिसमें 360 डिग्री हॉरिज़ॉन्टल व्यू (पूरी तरह रैप-अराउंड) और 180 डिग्री का वर्टिकल व्यू (सीधे ऊपर से सीधे नीचे) होता है. मिलने वाला 360-डिग्री पैनोरामा, किसी गोले पर प्रक्षेप को परिभाषित करता है, जिसमें इमेज को गोले की द्वि-आयामी सतह पर लिपटा हुआ होता है.

StreetViewPanorama से ऐसा व्यूअर मिलता है जो पैनोरामा को गोले के तौर पर रेंडर करता है और इसके बीच में कैमरा होता है. आपके पास, कैमरे के ज़ूम और ओरिएंटेशन (झुकाव और बियरिंग) को कंट्रोल करने के लिए, StreetViewPanoramaCamera में बदलाव करने का विकल्प है.

शुरू करें

प्रोजेक्ट सेट अप करना

Android प्रोजेक्ट के लिए Maps SDK टूल सेट अप करने के लिए, शुरुआती निर्देश देखें.

पैनोरामा जोड़ने से पहले Street View पैनोरामा की उपलब्धता देखें

Google Play services की SDK टूल क्लाइंट लाइब्रेरी में Street View के कुछ सैंपल होते हैं. इन्हें अपने प्रोजेक्ट में इंपोर्ट किया जा सकता है और इनका इस्तेमाल डेवलपमेंट के लिए किया जा सकता है. नमूने इंपोर्ट करने के दिशा-निर्देशों के लिए परिचय देखें.

Android Utility लाइब्रेरी के लिए Maps SDK टूल, क्लास की एक ओपन सोर्स लाइब्रेरी है. यह कई तरह के ऐप्लिकेशन के लिए काम की होती है. GitHub रिपॉज़िटरी में Street View मेटाडेटा यूटिलिटी शामिल है. यह सुविधा यह जांच करती है कि कोई जगह Street View पर काम करती है या नहीं. किसी Android ऐप्लिकेशन में Street View पैनोरामा जोड़ते समय होने वाली गड़बड़ियों से बचा जा सकता है. इसके लिए, इस मेटाडेटा उपयोगिता को कॉल करें और रिस्पॉन्स OK मिलने पर ही Street View पैनोरामा जोड़ें.

एपीआई का इस्तेमाल करना

किसी Android फ़्रैगमेंट में Street View पैनोरामा जोड़ने के लिए, नीचे दिए गए निर्देशों का पालन करें. अपने ऐप्लिकेशन में Street View जोड़ने का यह सबसे आसान तरीका है. फिर फ़्रैगमेंट, व्यू, और पैनोरामा को पसंद के मुताबिक बनाने के बारे में ज़्यादा पढ़ें.

Street View पैनोरामा जोड़ें

इस तरह का Street View पैनोरामा जोड़ने के लिए, नीचे दिया गया तरीका अपनाएं:

Street View पैनोरामा का डेमो

सारांश में:

  1. उस गतिविधि में फ़्रैगमेंट ऑब्जेक्ट जोड़ें जो Street View पैनोरामा को हैंडल करेगा. ऐसा करने का सबसे आसान तरीका यह है कि Activity की लेआउट फ़ाइल में <fragment> एलिमेंट जोड़ा जाए.
  2. OnStreetViewPanoramaReadyCallback इंटरफ़ेस का इस्तेमाल करें और StreetViewPanorama ऑब्जेक्ट को हैंडल करने के लिए, onStreetViewPanoramaReady(StreetViewPanorama) कॉलबैक के तरीके का इस्तेमाल करें.
  3. कॉलबैक को रजिस्टर करने के लिए, फ़्रैगमेंट पर मौजूद getStreetViewPanoramaAsync() को कॉल करें.

नीचे हर चरण के बारे में ज़्यादा जानकारी दी गई है.

फ़्रैगमेंट जोड़ें

फ़्रैगमेंट ऑब्जेक्ट तय करने के लिए, गतिविधि की लेआउट फ़ाइल में <fragment> एलिमेंट जोड़ें. इस एलिमेंट में, class एट्रिब्यूट को com.google.android.gms.maps.StreetViewPanoramaFragment (या SupportStreetViewPanoramaFragment) पर सेट करें.

यहां लेआउट फ़ाइल में फ़्रैगमेंट का एक उदाहरण दिया गया है:

<fragment
    android:name="com.google.android.gms.maps.StreetViewPanoramaFragment"
    android:id="@+id/streetviewpanorama"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>

Street View कोड जोड़ें

अपने ऐप्लिकेशन में Street View पैनोरामा का इस्तेमाल करने के लिए, आपको OnStreetViewPanoramaReadyCallback इंटरफ़ेस लागू करना होगा. साथ ही, StreetViewPanoramaFragment या StreetViewPanoramaView ऑब्जेक्ट पर कॉलबैक का इंस्टेंस सेट करना होगा. इस ट्यूटोरियल में StreetViewPanoramaFragment का इस्तेमाल किया गया है, क्योंकि अपने ऐप्लिकेशन में Street View को जोड़ने का यह सबसे आसान तरीका है. इसके लिए, कॉलबैक इंटरफ़ेस को लागू करें:

Kotlin



class StreetViewActivity : AppCompatActivity(), OnStreetViewPanoramaReadyCallback {
    // ...
}

Java


class StreetViewActivity extends AppCompatActivity implements OnStreetViewPanoramaReadyCallback {
    // ...
}

Activity के onCreate() तरीके में, लेआउट फ़ाइल को कॉन्टेंट व्यू के तौर पर सेट करें. उदाहरण के लिए, अगर लेआउट फ़ाइल का नाम main.xml है, तो इस कोड का इस्तेमाल करें:

Kotlin



override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_street_view)
    val streetViewPanoramaFragment =
        supportFragmentManager
            .findFragmentById(R.id.street_view_panorama) as SupportStreetViewPanoramaFragment
    streetViewPanoramaFragment.getStreetViewPanoramaAsync(this)
}

Java


@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_street_view);
    SupportStreetViewPanoramaFragment streetViewPanoramaFragment =
        (SupportStreetViewPanoramaFragment) getSupportFragmentManager()
            .findFragmentById(R.id.street_view_panorama);
    streetViewPanoramaFragment.getStreetViewPanoramaAsync(this);
}

FragmentManager.findFragmentById() को कॉल करके फ़्रैगमेंट के लिए हैंडल पाएं. इसमें अपने <fragment> एलिमेंट का रिसॉर्स आईडी पास करें. ध्यान दें कि लेआउट फ़ाइल बनाने पर, Android प्रोजेक्ट में रिसॉर्स आईडी R.id.streetviewpanorama अपने-आप जुड़ जाता है.

इसके बाद, फ़्रैगमेंट पर कॉलबैक सेट करने के लिए, getStreetViewPanoramaAsync() का इस्तेमाल करें.

Kotlin



val streetViewPanoramaFragment =
    supportFragmentManager
        .findFragmentById(R.id.street_view_panorama) as SupportStreetViewPanoramaFragment
streetViewPanoramaFragment.getStreetViewPanoramaAsync(this)

Java


SupportStreetViewPanoramaFragment streetViewPanoramaFragment =
    (SupportStreetViewPanoramaFragment) getSupportFragmentManager()
        .findFragmentById(R.id.street_view_panorama);
streetViewPanoramaFragment.getStreetViewPanoramaAsync(this);

इस्तेमाल के लिए तैयार StreetViewPanorama के नॉन-शून्य इंस्टेंस को वापस पाने के लिए, onStreetViewPanoramaReady(StreetViewPanorama) कॉलबैक के तरीके का इस्तेमाल करें.

Kotlin



override fun onStreetViewPanoramaReady(streetViewPanorama: StreetViewPanorama) {
    val sanFrancisco = LatLng(37.754130, -122.447129)
    streetViewPanorama.setPosition(sanFrancisco)
}

Java


@Override
public void onStreetViewPanoramaReady(StreetViewPanorama streetViewPanorama) {
    LatLng sanFrancisco = new LatLng(37.754130, -122.447129);
    streetViewPanorama.setPosition(sanFrancisco);
}

शुरुआती स्थिति को कॉन्फ़िगर करने के बारे में ज़्यादा जानकारी

मैप के उलट, एक्सएमएल की मदद से Street View पैनोरामा की शुरुआती स्थिति को कॉन्फ़िगर नहीं किया जा सकता. हालांकि, आपके पास तय किए गए विकल्पों वाले StreetViewPanoramaOptions ऑब्जेक्ट को पास करके, पैनोरामा को प्रोग्राम के हिसाब से कॉन्फ़िगर करने का विकल्प होता है.

  • अगर StreetViewPanoramaFragment का इस्तेमाल किया जा रहा है, तो फ़्रैगमेंट बनाने और पसंद के मुताबिक कॉन्फ़िगर किए गए विकल्पों में पास करने के लिए, StreetViewPanoramaFragment.newInstance(StreetViewPanoramaOptions options) के स्टैटिक फ़ैक्ट्री तरीके का इस्तेमाल करें.
  • अगर StreetViewPanoramaView का इस्तेमाल किया जा रहा है, तो StreetViewPanoramaView(Context, StreetViewPanoramaOptions) कंस्ट्रक्टर का इस्तेमाल करें और पसंद के मुताबिक कॉन्फ़िगर किए गए विकल्पों में पास करें.

Kotlin



val sanFrancisco = LatLng(37.754130, -122.447129)
val view = StreetViewPanoramaView(
    this,
    StreetViewPanoramaOptions().position(sanFrancisco)
)

Java


LatLng sanFrancisco = new LatLng(37.754130, -122.447129);
StreetViewPanoramaView view = new StreetViewPanoramaView(this,
    new StreetViewPanoramaOptions().position(sanFrancisco));

StreetViewPanoramaफ़्रैगमेंट के बारे में ज़्यादा जानकारी

StreetViewPanoramaFragment, Android फ़्रैगमेंट क्लास का सब-क्लास है. इससे आपको Android फ़्रैगमेंट में Street View पैनोरामा दिखाने की सुविधा मिलती है. StreetViewPanoramaFragment ऑब्जेक्ट, पैनोरामा के लिए कंटेनर का काम करते हैं और StreetViewPanorama ऑब्जेक्ट का ऐक्सेस देते हैं.

StreetViewPanoramaView

StreetViewPanoramaView, Android View क्लास की सब-क्लास है. इसकी मदद से, Android View में Street View पैनोरामा दिखाया जा सकता है. View, स्क्रीन पर दिखने वाले आयताकार हिस्से को दिखाता है. साथ ही, यह Android ऐप्लिकेशन और विजेट के लिए बुनियादी बिल्डिंग ब्लॉक है. StreetViewPanoramaFragment की तरह, StreetViewPanoramaView, पैनोरामा के लिए कंटेनर की तरह काम करता है. इससे StreetViewPanorama ऑब्जेक्ट की मदद से, मुख्य फ़ंक्शन की जानकारी मिलती है. इस क्लास के उपयोगकर्ताओं को गतिविधि की लाइफ़ साइकल के सभी तरीकों (जैसे कि onCreate(), onDestroy(), onResume(), और onPause()) को StreetViewPanoramaView क्लास में दिए गए तरीकों से फ़ॉरवर्ड करना होगा).

उपयोगकर्ता के कंट्रोल वाली सुविधा को पसंद के मुताबिक बनाएं

डिफ़ॉल्ट रूप से, उपयोगकर्ता को Street View पैनोरामा देखते समय ये सुविधाएं मिलती हैं: पैन करना, ज़ूम करना, और आस-पास के पैनोरामा देखने के लिए. StreetViewPanorama पर तरीकों की मदद से, लोगों के कंट्रोल किए जाने वाले जेस्चर को चालू और बंद किया जा सकता है. हाथ के जेस्चर की सुविधा बंद होने पर भी, प्रोग्राम के हिसाब से, अपने-आप होने वाले बदलाव किए जा सकते हैं.

पैनोरामा की जगह सेट करें

Street View पैनोरामा की जगह सेट करने के लिए, StreetViewPanorama.setPosition() पर कॉल करें और LatLng पास करें. radius और source को वैकल्पिक पैरामीटर के तौर पर भी पास किया जा सकता है.

अगर आप उस क्षेत्र को चौड़ा या छोटा करना चाहते हैं जिसमें Street View का इस्तेमाल करने से मिलता-जुलता पैनोरामा दिखता है, तो दायरा फ़ायदेमंद होता है. 0 की रेडियस का मतलब है कि पैनोरामा पूरी तरह बताए गए LatLng से जुड़ा होना चाहिए. डिफ़ॉल्ट दायरा 50 मीटर है. अगर मैच करने वाले एरिया में एक से ज़्यादा पैनोरामा हैं, तो एपीआई सबसे अच्छा मैच दिखाएगा.

सोर्स तब फ़ायदेमंद होता है, जब आपको Street View को सिर्फ़ बाहर के पैनोरामा देखने के लिए प्रतिबंधित करना हो. डिफ़ॉल्ट रूप से, Street View पैनोरामा, म्यूज़ियम, सार्वजनिक इमारतों, कैफ़े, और कारोबारों जैसी जगहों के अंदर हो सकता है. ध्यान दें: हो सकता है कि बताई गई जगह के लिए आउटडोर पैनोरामा मौजूद न हों.

Kotlin



val sanFrancisco = LatLng(37.754130, -122.447129)

// Set position with LatLng only.
streetViewPanorama.setPosition(sanFrancisco)

// Set position with LatLng and radius.
streetViewPanorama.setPosition(sanFrancisco, 20)

// Set position with LatLng and source.
streetViewPanorama.setPosition(sanFrancisco, StreetViewSource.OUTDOOR)

// Set position with LaLng, radius and source.
streetViewPanorama.setPosition(sanFrancisco, 20, StreetViewSource.OUTDOOR)

Java


LatLng sanFrancisco = new LatLng(37.754130, -122.447129);

// Set position with LatLng only.
streetViewPanorama.setPosition(sanFrancisco);

// Set position with LatLng and radius.
streetViewPanorama.setPosition(sanFrancisco, 20);

// Set position with LatLng and source.
streetViewPanorama.setPosition(sanFrancisco, StreetViewSource.OUTDOOR);

// Set position with LaLng, radius and source.
streetViewPanorama.setPosition(sanFrancisco, 20, StreetViewSource.OUTDOOR);

इसके अलावा, आप पैनोरामा आईडी के आधार पर जगह की जानकारी सेट करने के लिए, panoId को StreetViewPanorama.setPosition() पर पास कर सकते हैं.

पास के पैनोरामा का पैनोरामा आईडी पाने के लिए, सबसे पहले getLocation() का इस्तेमाल करके StreetViewPanoramaLocation को फिर से पाएं. इस ऑब्जेक्ट में मौजूदा पैनोरामा का आईडी और StreetViewPanoramaLink ऑब्जेक्ट की एक कलेक्शन है. हर ऑब्जेक्ट में, मौजूदा पैनोरामा से कनेक्ट किए गए पैनोरामा का आईडी शामिल है.

Kotlin



streetViewPanorama.location.links.firstOrNull()?.let { link: StreetViewPanoramaLink ->
    streetViewPanorama.setPosition(link.panoId)
}

Java


StreetViewPanoramaLocation location = streetViewPanorama.getLocation();
if (location != null && location.links != null) {
    streetViewPanorama.setPosition(location.links[0].panoId);
}

ज़ूम इन और ज़ूम आउट करना

StreetViewPanoramaCamera.zoom को सेट करके, ज़ूम के लेवल को प्रोग्राम के हिसाब से बदला जा सकता है. ज़ूम को 1.0 पर सेट करने से इमेज को 2 के कारक से आवर्धित किया जाएगा.

यह स्निपेट, ज़ूम को पचास प्रतिशत बढ़ाते हुए StreetViewPanoramaCamera.Builder() का इस्तेमाल करता है. ऐसा, एक नया कैमरा बनाने के लिए किया जाता है, जिसमें मौजूदा कैमरे को झुकाया और रखा गया हो.

Kotlin



val zoomBy = 0.5f
val camera = StreetViewPanoramaCamera.Builder()
    .zoom(streetViewPanorama.panoramaCamera.zoom + zoomBy)
    .tilt(streetViewPanorama.panoramaCamera.tilt)
    .bearing(streetViewPanorama.panoramaCamera.bearing)
    .build()

Java


float zoomBy = 0.5f;
StreetViewPanoramaCamera camera = new StreetViewPanoramaCamera.Builder()
    .zoom(streetViewPanorama.getPanoramaCamera().zoom + zoomBy)
    .tilt(streetViewPanorama.getPanoramaCamera().tilt)
    .bearing(streetViewPanorama.getPanoramaCamera().bearing)
    .build();

कैमरे का ओरिएंटेशन (पॉइंट ऑफ़ व्यू) सेट करना

बियरिंग और झुकाने की सुविधा को StreetViewPanoramaCamera पर सेट करके, आप Street View कैमरे का ओरिएंटेशन तय कर सकते हैं.

बियरिंग
जिस दिशा में कैमरा ले जा रहा है, वह कैमरे की जगह के आस-पास सही उत्तर से घड़ी की दिशा में डिग्री में बताया गया है. सही उत्तर 0 है, पूर्व का मतलब 90 है, दक्षिण 180 है, दक्षिण 270 है.
झुकाएं
Y-ऐक्सिस, ऊपर या नीचे की ओर झुका हुआ है. रेंज -90 से लेकर 0 से 90 तक होती है. इसमें -90 सीधे नीचे की ओर दिखते हैं, 0 क्षितिज के बीच में, और 90 सीधे ऊपर की ओर दिखते हैं. वैरियंस को कैमरे के शुरुआती डिफ़ॉल्ट पिच से मापा जाता है. यह अक्सर (लेकिन हमेशा नहीं) सपाट हॉरिज़ॉन्टल होता है. उदाहरण के लिए, पहाड़ी पर ली गई किसी इमेज में शायद एक डिफ़ॉल्ट पिच होगी, जो हॉरिज़ॉन्टल नहीं होगी.

अगला स्निपेट, बेयरिंग को बाईं ओर 30 डिग्री बदलते हुए, मौजूदा कैमरे के ज़ूम और झुकाव के साथ नया कैमरा बनाने के लिए StreetViewPanoramaCamera.Builder() का इस्तेमाल करता है.

Kotlin



val panBy = 30f
val camera = StreetViewPanoramaCamera.Builder()
    .zoom(streetViewPanorama.panoramaCamera.zoom)
    .tilt(streetViewPanorama.panoramaCamera.tilt)
    .bearing(streetViewPanorama.panoramaCamera.bearing - panBy)
    .build()

Java


float panBy = 30;
StreetViewPanoramaCamera camera = new StreetViewPanoramaCamera.Builder()
    .zoom(streetViewPanorama.getPanoramaCamera().zoom)
    .tilt(streetViewPanorama.getPanoramaCamera().tilt)
    .bearing(streetViewPanorama.getPanoramaCamera().bearing - panBy)
    .build();

नीचे दिया गया स्निपेट, कैमरे को 30 डिग्री ऊपर की ओर झुकाता है.

Kotlin



var tilt = streetViewPanorama.panoramaCamera.tilt + 30
tilt = if (tilt > 90) 90f else tilt
val previous = streetViewPanorama.panoramaCamera
val camera = StreetViewPanoramaCamera.Builder(previous)
    .tilt(tilt)
    .build()

Java


float tilt = streetViewPanorama.getPanoramaCamera().tilt + 30;
tilt = (tilt > 90) ? 90 : tilt;

StreetViewPanoramaCamera previous = streetViewPanorama.getPanoramaCamera();

StreetViewPanoramaCamera camera = new StreetViewPanoramaCamera.Builder(previous)
    .tilt(tilt)
    .build();

कैमरे की मूवमेंट पर ऐनिमेशन का कमाल देखें

कैमरे की मूवमेंट को ऐनिमेट करने के लिए, StreetViewPanorama.animateTo() पर कॉल करें. ऐनिमेशन, कैमरे के मौजूदा एट्रिब्यूट और नए कैमरे के एट्रिब्यूट के बीच इंटरपोलेट करता है. अगर आपको ऐनिमेशन के बिना सीधे कैमरे पर जाना है, तो समय को 0 पर सेट करें.

Kotlin



// Keeping the zoom and tilt. Animate bearing by 60 degrees in 1000 milliseconds.
val duration: Long = 1000
val camera = StreetViewPanoramaCamera.Builder()
    .zoom(streetViewPanorama.panoramaCamera.zoom)
    .tilt(streetViewPanorama.panoramaCamera.tilt)
    .bearing(streetViewPanorama.panoramaCamera.bearing - 60)
    .build()
streetViewPanorama.animateTo(camera, duration)

Java


// Keeping the zoom and tilt. Animate bearing by 60 degrees in 1000 milliseconds.
long duration = 1000;
StreetViewPanoramaCamera camera =
    new StreetViewPanoramaCamera.Builder()
        .zoom(streetViewPanorama.getPanoramaCamera().zoom)
        .tilt(streetViewPanorama.getPanoramaCamera().tilt)
        .bearing(streetViewPanorama.getPanoramaCamera().bearing - 60)
        .build();
streetViewPanorama.animateTo(camera, duration);

इस इमेज में तब नतीजा दिखाया गया है, जब ऊपर दिए गए ऐनिमेशन को Handler.postDelayed() का इस्तेमाल करके, हर 2,000 मिलीसेकंड में चलाने के लिए शेड्यूल किया जाता है:

Street View पैनोरामा ऐनिमेशन का डेमो