reviewsהשקת Places UI Kit: ספריית רכיבים מוכנה לשימוש בעלות נמוכה, שמאפשרת לכם להוסיף לכל מפה שתבחרו את ממשק המשתמש המוכר של 'מקומות' במפות Google. כדאי לנסות אותו ולשלוח לנו משוב כדי לעזור לנו לעצב את העתיד של GMP.
הוספת סמן למפה תלת-ממדית
קל לארגן דפים בעזרת אוספים
אפשר לשמור ולסווג תוכן על סמך ההעדפות שלך.
אפשר להשתמש בסמנים כדי להציג מיקומים בודדים במפה. בדף הזה מוסבר איך להוסיף סמן למפה באופן פרוגרמטי וגם באמצעות HTML.
הוספת סמן באמצעות HTML
כדי להוסיף סמן תלת-ממדי באמצעות HTML, מוסיפים רכיב צאצא gmp-marker-3d
לרכיב gmp-map-3d
. קטע הקוד הבא מראה איך מוסיפים סמנים לדף אינטרנט:
<gmp-map-3d
mode="hybrid"
center="48.861000,2.335861"
heading="110"
tilt="67.5"
range="1000"
style="height:400px"
>
<gmp-marker-3d
position="48.861000,2.335861">
</gmp-marker-3d>
</gmp-map-3d>
הוספת סמן באופן פרוגרמטי
כדי להוסיף סמן תלת-ממדי למפה באופן פרוגרמטי, יוצרים Marker3DElement
חדש, מעבירים קואורדינטות של lat/lng
והפניה למפת הבסיס, כמו בדוגמה הזו:
const marker = new Marker3DElement({
position: {lat: 47.6093, lng: -122.3402}, // (Required) Marker must have a lat/lng.
altitudeMode : "ABSOLUTE", // (Optional) Treated as CLAMP_TO_GROUND if omitted.
extruded : true, // (Optional) Draws line from ground to the bottom of the marker.
label : "Basic Marker" // (Optional) Add a label to the marker.
});
map.append(marker); // The marker must be appended to the map.
השלבים הבאים
אלא אם צוין אחרת, התוכן של דף זה הוא ברישיון Creative Commons Attribution 4.0 ודוגמאות הקוד הן ברישיון Apache 2.0. לפרטים, ניתן לעיין במדיניות האתר Google Developers. Java הוא סימן מסחרי רשום של חברת Oracle ו/או של השותפים העצמאיים שלה.
עדכון אחרון: 2025-07-22 (שעון UTC).
[null,null,["עדכון אחרון: 2025-07-22 (שעון UTC)."],[],[],null,["Select platform: [Android](/maps/documentation/maps-3d/android-sdk/add-a-marker \"View this page for the Android platform docs.\") [iOS](/maps/documentation/maps-3d/ios-sdk/add-a-marker \"View this page for the iOS platform docs.\") [JavaScript](/maps/documentation/javascript/3d/marker-add \"View this page for the JavaScript platform docs.\")\n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\n| This product or feature is in Preview (pre-GA). Pre-GA products and features might have limited support, and changes to pre-GA products and features might not be compatible with other pre-GA versions. Pre-GA Offerings are covered by the [Google\n| Maps Platform Service Specific Terms](https://cloud.google.com/maps-platform/terms/maps-service-terms). For more information, see the [launch stage\n| descriptions](/maps/launch-stages).\n\n\u003cbr /\u003e\n\nUse markers to display single locations on a map. This page shows how to add a\nmarker to a map programmatically, and by using HTML.\n\n\nAdd a marker using HTML\n\nTo add a 3D marker using HTML, add a `gmp-marker-3d` child element to the\n`gmp-map-3d` element. The following snippet shows adding markers to a web page: \n\n \u003cgmp-map-3d\n mode=\"hybrid\"\n center=\"48.861000,2.335861\"\n heading=\"110\"\n tilt=\"67.5\"\n range=\"1000\"\n style=\"height:400px\"\n \u003e\n \u003cgmp-marker-3d\n position=\"48.861000,2.335861\"\u003e\n \u003c/gmp-marker-3d\u003e\n \u003c/gmp-map-3d\u003e\n\nAdd a marker programmatically\n\nTo add a 3D marker to a map programmatically, create a new `Marker3DElement`,\npassing `lat/lng` coordinates and a reference to the basemap, as shown in this\nexample: \n\n const marker = new Marker3DElement({\n position: {lat: 47.6093, lng: -122.3402}, // (Required) Marker must have a lat/lng.\n altitudeMode : \"ABSOLUTE\", // (Optional) Treated as CLAMP_TO_GROUND if omitted.\n extruded : true, // (Optional) Draws line from ground to the bottom of the marker.\n label : \"Basic Marker\" // (Optional) Add a label to the marker.\n });\n\n map.append(marker); // The marker must be appended to the map.\n\nNext steps\n\n- [Basic marker customization](/maps/documentation/javascript/3d/marker-customization)"]]