Street View

בחירת פלטפורמה: Android iOS JavaScript

ב-Google Street View מוצגות תמונות פנורמיות ב-360 מעלות של כבישים ייעודיים דרך אזור הכיסוי שלו.

הסרטון הזה מראה איך תוכלו להשתמש בשירות Street View כדי לתת למשתמשים שלכם חוויה אמיתית של כתובת במפה, ולספק להם הקשר משמעותי לגבי היעד שלהם או כל מקום שבו הם מתעניינים.

הכיסוי הזמין דרך מפות Google ל-Android API v2 זהה לזה של אפליקציית מפות Google במכשיר Android. מידע נוסף על Street View והצגת האזורים הנתמכים במפה אינטראקטיבית זמין במאמר מידע על Street View.

הכיתה StreetViewPanorama יוצרת מודלים ל-Street View באפליקציה שלכם. בממשק המשתמש, תמונה פנורמית מיוצגת על ידי אובייקט StreetViewPanoramaFragment או StreetViewPanoramaView.

דוגמאות קוד

מאגר ApiDemos ב-GitHub כולל דוגמאות שממחישות את השימוש ב-Street View.

דוגמאות ל-Java:

דוגמאות מ-Kotlin:

סקירה כללית של Street View ב-SDK של מפות Google ל-Android

ה-SDK של מפות ל-Android מספק שירות Street View לצורך ביצוע ועיבוד התמונות ב-Google Street View. התמונות מוחזרות כתמונות פנורמה.

כל תמונת פנורמה של Street View היא תמונה או קבוצת תמונות, שמספקת תצוגה מלאה של התמונה ב-360 מעלות ממיקום יחיד. התמונות תואמות לתחזית המלבנית (Plate Carrée), שמכילה 360 מעלות של תצוגה אופקית (סיבוב מלא) ו-180 מעלות של תצוגה אנכית (ישירות עד ישר) תמונת פנורמה של 360 מעלות שמתקבלת מגדירה תחזית בכדור הארץ, שהתמונה עטפת את השטח הדו-מימדי של הכדור הזה.

StreetViewPanorama מספק לצופה שמעבד את הפנורמה כתמונה עם מצלמה במרכזה. אפשר לשלוט בStreetViewPanoramaCamera כדי לשלוט בזום ובכיוון (ההטיה והמיסב) של המצלמה.

כדי להתחיל:

כדי להגדיר SDK של מפות ל-Android, צריך לפעול לפי המדריך לתחילת העבודה. לאחר מכן מוסיפים את תמונת הפנורמה של Street View, כמתואר בהמשך.

ספריית הלקוח של Google Play Services SDK כוללת כמה דוגמאות ל-Street View שאפשר לייבא לפרויקט ולהשתמש בהן כבסיס לפיתוח. במבוא תמצאו הנחיות לייבוא הדוגמאות.

שימוש ב-API

בצעו את ההוראות שבהמשך כדי להוסיף תמונת פנורמה של Street View לקטע Android. זו הדרך הפשוטה ביותר להוסיף את Street View לאפליקציה. אחר כך תוכלו לקרוא עוד על מקטעים, תצוגות והתאמה אישית של הפנורמה.

הוספת תמונת פנורמה ב-Street View

כדי להוסיף תמונת פנורמה ב-Street View, בצעו את השלבים הבאים:

הדגמה של פנורמה ב-Street View

בסיכום:

  1. אפשר להוסיף אובייקט מקטע לפעילות ש שיטפל בנוף של Street View. הדרך הקלה ביותר לעשות זאת היא להוסיף רכיב <fragment> לקובץ הפריסה של Activity.
  2. מטמיעים את הממשק של OnStreetViewPanoramaReadyCallback ומשתמשים בשיטת הקריאה החוזרת onStreetViewPanoramaReady(StreetViewPanorama) כדי לטפל באובייקט 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 לאפליקציה. השלב הראשון הוא להטמיע את הממשק של הקריאה החוזרת (callback):

Java


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

      

Kotlin


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

      

בשיטה Activity's onCreate() יש להגדיר את קובץ הפריסה כתצוגת התוכן. לדוגמה, אם שם הפריסה הוא main.xml, השתמשו בקוד הזה:

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);
}

      

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)
}

      

כדי לקבל מזהה קטע קוד, צריך לקרוא לו FragmentManager.findFragmentById() ולהעביר אותו למזהה המשאב של רכיב <fragment>. שימו לב שמזהה המשאב R.id.streetviewpanorama מתווסף באופן אוטומטי לפרויקט Android כשבונים את קובץ הפריסה.

לאחר מכן אפשר להשתמש ברכיב getStreetViewPanoramaAsync() כדי להגדיר את הקריאה החוזרת (fragment) של הקטע.

Java


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

      

Kotlin


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

      

אפשר להשתמש בשיטת הקריאה החוזרת onStreetViewPanoramaReady(StreetViewPanorama) כדי לאחזר מופע שאינו ריק של StreetViewPanorama, והוא מוכן לשימוש.

Java


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

      

Kotlin


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

      

מידע נוסף על הגדרת מצב ראשוני

בניגוד למפה, לא ניתן להגדיר את המצב הראשוני של תמונת הפנורמה ב-Street View באמצעות XML. עם זאת, אפשר להגדיר את תמונת הפנורמה באופן פרוגרמטי על ידי העברה של אובייקט StreetViewPanoramaOptions, שמכיל את האפשרויות שצוינו.

Java


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

      

Kotlin


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

      

מידע נוסף על StreetViewPanoramaFragment

StreetViewPanoramaFragment היא מחלקת משנה של המחלקה Android Fragment, שמאפשרת לכם למקם פנורמה של Street View בקטע קוד של Android. StreetViewPanoramaFragment אובייקטים משמשים כמאגרים של התמונה הפנורמית, ומספקים גישה לאובייקט StreetViewPanorama.

StreetViewPanoramaView

StreetViewPanoramaView, מחלקת משנה של הכיתה View ל-Android, מאפשרת להציב פנורמה של Street View ב-Android 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 מטרים. אם יש יותר מפנורמה אחת באזור התואם, ממשק ה-API יחזיר את ההתאמה הטובה ביותר.

מקור שימושי אם אתם רוצים להגביל את Street View כך שאפשר לחפש רק נופים פנורמיים שנמצאים בחוץ. כברירת מחדל, תמונות פנורמיות של Street View יכולות להופיע במקומות כמו מוזיאונים, בניינים ציבוריים, בתי קפה ועסקים. לתשומת ליבך, יכול להיות שלא קיימות תמונות פנורמה במיקום שצוין.

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);

      

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)

      

לחלופין, אפשר להגדיר את המיקום על סמך מזהה פנורמה על ידי העברה של panoId אל StreetViewPanorama.setPosition().

כדי לאחזר את מזהה הפנורמה לצורך נופים פנורמיים, תחילה משתמשים בתג getLocation() כדי לאחזר את StreetViewPanoramaLocation. האובייקט מכיל את המזהה של הפנורמה הנוכחית ומערך של StreetViewPanoramaLink אובייקטים, שכל אחד מהם מכיל את המזהה של הפנורמה המחוברת לאובייקט הנוכחי.

Java


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

      

Kotlin


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

      

שינוי מרחק התצוגה

אפשר לשנות את רמת המרחק מהתצוגה באופן פרוגרמטי על ידי הגדרה של StreetViewPanoramaCamera.zoom. אם תגדירו את מרחק התצוגה ל-1.0, התמונה תגדל פי 2.

קטע הקוד הבא משמש את StreetViewPanoramaCamera.Builder() כדי לבנות מצלמה חדשה עם הטיה ומיסבים של המצלמה הקיימת, תוך הגדלת מרחק התצוגה בחמישים אחוזים.

Java


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

      

Kotlin


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

      

הגדרת כיוון המצלמה (נקודת מבט)

אפשר לקבוע את הכיוון של מצלמת Street View על ידי הגדרת הכיוון וההטיה ב-StreetViewPanoramaCamera.

נושאת
הכיוון שאליו המצלמה מפנה, שצוינה במעלות בכיוון השעון מצפון אמיתי, מסביב ללוקוס של המצלמה. צפון אמיתי הוא 0, מזרח הוא 90, דרום הוא 180, מערב הוא 270.
הטיה
ציר ה-Y הטיה למעלה או למטה. הטווח נע בין 90- ל-90, כאשר 90- יורדת למטה, 0 ממורכזת באופק, ו-90 מסתכלת ישר למעלה. השונות נמדדת מגובה ברירת המחדל של המצלמה, שהוא בדרך כלל אופקי (אבל לא תמיד) אופקי. לדוגמה, סביר להניח שהתמונה שצולמה על גבעה תכלול גובה ברירת מחדל שאינו אופקי.

קטע הקוד הבא משמש את StreetViewPanoramaCamera.Builder() כדי לבנות מצלמה חדשה עם הזום וההטיה של המצלמה הקיימת, תוך שינוי הכיוון של 30 מעלות שמאלה.

Java


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

      

Kotlin


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

      

קטע הקוד הבא מטים את המצלמה כלפי מעלה ב-30 מעלות.

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();

      

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()

      

אנימציה של תנועות המצלמה

כדי ליצור אנימציה של תנועות המצלמה, צריך להתקשר למספר StreetViewPanorama.animateTo(). האנימציה מתמזגת בין מאפייני המצלמה הנוכחיים למאפייני המצלמה החדשים. אם אתם רוצים לעבור ישירות למצלמה ללא אנימציה, תוכלו להגדיר את משך הזמן ל-0.

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);

      

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)

      

התוצאה הבאה מוצגת כשקובעים תזמון להפעלת האנימציה שלמעלה בכל 2,000 אלפיות השנייה, באמצעות הפונקציה Handler.postDelayed():

הדגמה של האנימציה בפנורמה של Street View