התאמה לשוק המקומי

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

בטבלת הזמינות של מפות Google אפשר לבדוק את הזמינות של מפות תלת-ממדיות ב-Maps JavaScript.

לוקליזציה של שפה

כברירת מחדל, Maps JavaScript API משתמש בהגדרות השפה שהמשתמש מציין בדפדפן כדי לקבוע באיזה תרגום של המפה להשתמש. עם זאת, אתם יכולים לשנות את זה ולהגדיר שפה ספציפית באמצעות הפרמטר language כשאתם יוצרים מפה תלת-ממדית. אפשר לעדכן את השפה והאזור אחרי שהמפה מאותחלת.

הגדרת הפרמטר language משפיעה על השפה שבה מוצגים הפקדים, ההסברים הקצרים וההודעות על זכויות יוצרים. הוא משפיע גם על התרגום של מאפיינים פוליטיים, מתארים ומאפיינים טבעיים, כמו שינוי של "Geneva" ל-"Genève" או של "lake" ל-"lac", או שינוי הכיוון שבו השפה מוצגת.

מפות תלת-ממדיות ב-Maps JavaScript מחפשות העדפות לוקליזציה בסדר הבא. אם לא מוגדרות העדפות בשלב הראשון, המערכת ממשיכה לחפש לפי הסדר שצוין. אם יש הוראות לוקליזציה סותרות, הן נפתרות לפי סדר העדיפויות הבא:

  1. ההגדרה של Map3DElement. זה המקום הראשון שבו המערכת של מפות Google בתלת-ממד מחפשת את העדפות הלוקליזציה.
  2. טוען Maps JavaScript API. השפה שצוינה בזמן הטעינה של Maps JavaScript API.
  3. הגדרות הדפדפן והדומיין. הגדרת הדפדפן משמשת לשפה, והדומיין שממנו נטען Maps JavaScript API משמש לאזור.

בדוגמה הבאה מוצגת מפה בסינית והאזור מוגדר לסין:

TypeScript

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

    const map = new Map3DElement({
        center: {
            lat: 49.75371685807847,
            lng: -123.13227141171181,
            altitude: 30,
        },
        tilt: 50.64793990040634,
        heading: 44.480020261589154,
        range: 51618.36056532338,
        language: 'ZH',
        region: 'CN',
        mode: 'HYBRID',
    });

    document.body.append(map);
}

void init();

JavaScript

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

    const map = new Map3DElement({
        center: {
            lat: 49.75371685807847,
            lng: -123.13227141171181,
            altitude: 30,
        },
        tilt: 50.64793990040634,
        heading: 44.480020261589154,
        range: 51618.36056532338,
        language: 'ZH',
        region: 'CN',
        mode: 'HYBRID',
    });

    document.body.append(map);
}

void init();

CSS

/* 
 * Always set the map height explicitly to define the size of the div element
 * that contains the map. 
 */
#gmp-map-3d {
    height: 100%;
}
html,
body {
    height: 100%;
    margin: 0;
    padding: 0;
}

HTML

<html>
    <head>
        <title>3d localization</title>

        <link rel="stylesheet" type="text/css" href="./style.css" />
        <script type="module" src="./index.js"></script>
        <script>
            // prettier-ignore
            (g=>{var h,a,k,p="The Google Maps JavaScript API",c="google",l="importLibrary",q="__ib__",m=document,b=window;b=b[c]||(b[c]={});var d=b.maps||(b.maps={}),r=new Set,e=new URLSearchParams,u=()=>h||(h=new Promise(async(f,n)=>{await (a=m.createElement("script"));e.set("libraries",[...r]+"");for(k in g)e.set(k.replace(/[A-Z]/g,t=>"_"+t[0].toLowerCase()),g[k]);e.set("callback",c+".maps."+q);a.src=`https://maps.${c}apis.com/maps/api/js?`+e;d[q]=f;a.onerror=()=>h=n(Error(p+" could not load."));a.nonce=m.querySelector("script[nonce]")?.nonce||"";m.head.append(a)}));d[l]?console.warn(p+" only loads once. Ignoring:",g):d[l]=(f,...n)=>r.add(f)&&u().then(()=>d[l](f,...n))})({
                key: "GOOGLE_MAPS_API_KEY"
            });
        </script>
    </head>
    <body></body>
</html>

לוקליזציה של אזור

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