با مجموعه‌ها، منظم بمانید
ذخیره و طبقه‌بندی محتوا براساس اولویت‌های شما.
Maps JavaScript API دو پیاده سازی متفاوت از نقشه را ارائه می دهد: شطرنجی و برداری. نقشه شطرنجی به‌طور پیش‌فرض بارگیری می‌شود و نقشه را به‌عنوان شبکه‌ای از کاشی‌های تصویر شطرنجی مبتنی بر پیکسل بارگیری می‌کند، که توسط Google Maps Platform در سمت سرور تولید می‌شوند، سپس به برنامه وب شما ارائه می‌شوند. نقشه برداری از کاشی های مبتنی بر برداری تشکیل شده است که در زمان بارگذاری در سمت کلاینت با استفاده از WebGL ترسیم می شوند، یک فناوری وب که به مرورگر اجازه می دهد تا به GPU دستگاه کاربر برای ارائه گرافیک های دو بعدی و سه بعدی دسترسی داشته باشد. نوع نقشه برداری برای بهترین تجربه کاربری توصیه می شود، زیرا وفاداری بصری بهبود یافته و همچنین توانایی کنترل شیب و عنوان روی نقشه را فراهم می کند. درباره ویژگی های نقشه برداری بیشتر بدانید.
نوع رندر نقشه را با تعیین گزینه renderingType map یا با تنظیم گزینه در شناسه نقشه مرتبط تنظیم کنید. گزینه renderingType هرگونه تنظیمات نوع رندر انجام شده با پیکربندی شناسه نقشه را لغو می کند.
گزینه renderingType مشخص کنید
از گزینه renderingType برای تعیین نوع رندر شطرنجی یا برداری برای نقشه خود استفاده کنید (بدون نیاز به شناسه نقشه). برای نقشه‌هایی که با استفاده از عنصر div و جاوا اسکریپت بارگیری می‌شوند، نوع رندر پیش‌فرض google.maps.RenderingType.RASTER است. این مراحل را برای تنظیم گزینه renderingType انجام دهید:
بارگذاری کتابخانه RenderingType ؛ این را می توان هنگام بارگیری کتابخانه Maps انجام داد:
وقتی نوع رندر نقشه برداری تنظیم شد، باید گزینه ها را برای ویژگی های مورد نیاز تنظیم کنید.
برای فعال کردن شیب، گزینه tiltInteractionEnabled map را روی true تنظیم کنید یا map.setTiltInteractionEnabled(true) را فراخوانی کنید.
برای فعال کردن پاننگ، گزینه headingInteractionEnabled map را روی true تنظیم کنید یا map.setHeadingInteractionEnabled(true) را فراخوانی کنید.
برای نقشه‌هایی که با استفاده از عنصر <gmp-map> بارگیری می‌شوند، نوع رندر پیش‌فرض google.maps.RenderingType.VECTOR است، با کنترل شیب و عنوان فعال است. برای تنظیم نوع رندر با استفاده از عنصر <gmp-map> ، از ویژگی rendering-type استفاده کنید.
از شناسه نقشه برای تنظیم نوع رندر استفاده کنید
همچنین می توانید نوع رندر را با استفاده از شناسه نقشه مشخص کنید. برای ایجاد شناسه نقشه جدید، مراحل استفاده از استایل نقشه مبتنی بر ابر را دنبال کنید - شناسه نقشه دریافت کنید . مطمئن شوید که نوع Map را روی جاوا اسکریپت تنظیم کرده و یک گزینه ( Vector یا Raster ) را انتخاب کنید. گزینه Tilt and Rotation را علامت بزنید تا شیب و چرخش روی نقشه فعال شود. انجام این کار به شما این امکان را می دهد که به صورت برنامه ریزی شده این مقادیر را تنظیم کنید و همچنین به کاربران امکان می دهد شیب و سمت را مستقیماً روی نقشه تنظیم کنند. اگر استفاده از شیب یا عنوان بر برنامه شما تأثیر منفی می گذارد، شیب و چرخش را علامت نزنید تا کاربران نتوانند شیب و چرخش را تنظیم کنند.
در مرحله بعد، کد اولیه نقشه خود را با شناسه نقشه که ایجاد کرده اید به روز کنید. می توانید شناسه های نقشه خود را در صفحه مدیریت نقشه ها پیدا کنید. زمانی که نقشه را با استفاده از ویژگی mapId نمونه برداری می کنید، همانطور که در اینجا نشان داده شده است، یک شناسه نقشه ارائه دهید:
تاریخ آخرین بهروزرسانی 2025-08-27 بهوقت ساعت هماهنگ جهانی.
[null,null,["تاریخ آخرین بهروزرسانی 2025-08-27 بهوقت ساعت هماهنگ جهانی."],[[["\u003cp\u003eThe Maps JavaScript API offers two map types: raster (default) and vector (recommended for enhanced user experience with tilt and heading control).\u003c/p\u003e\n"],["\u003cp\u003eYou can set the rendering type using the \u003ccode\u003erenderingType\u003c/code\u003e map option or by associating a map ID with specific rendering settings.\u003c/p\u003e\n"],["\u003cp\u003eVector maps provide better visual quality and allow for tilt and heading manipulation, requiring enabling specific interactions for these features.\u003c/p\u003e\n"],["\u003cp\u003eMap IDs offer pre-configured rendering types and can be created and managed through the Cloud console, enabling customization without code changes.\u003c/p\u003e\n"],["\u003cp\u003eUsing a map ID and API key from the same Google Cloud project is recommended for optimal integration and management.\u003c/p\u003e\n"]]],[],null,["# Rendering type (raster and vector)\n\nThe Maps JavaScript API offers two different implementations of the map: raster\nand vector. The raster map is loaded by default, and loads the map as a grid of\npixel-based raster image tiles, which are generated by Google Maps Platform\nserver-side, then served to your web app. The vector map is a composed of\nvector-based tiles, which are drawn at load time on the client-side using\nWebGL, a web technology that allows the browser to access the GPU on the user's\ndevice to render 2D and 3D graphics. The vector map type is recommended for the\nbest user experience, as it provides improved visual fidelity as well as the\nability to control tilt and heading on the map.\n[Learn more about vector map features.](/maps/documentation/javascript/vector-map)\n\nSet the rendering type for a map either by specifying the `renderingType` map\noption, or by setting the option on an associated map ID. The `renderingType`\noption overrides any rendering type settings made by configuring a map ID.\n\nSpecify the `renderingType` option\n----------------------------------\n\nUse the `renderingType` option to specify either the raster or vector\nrendering type for your map (no map ID required). For maps loaded using a `div`\nelement and JavaScript, the default rendering type is\n`google.maps.RenderingType.RASTER`. Take these steps to set the `renderingType`\noption:\n\n1. Load the `RenderingType` library; this can be done when loading the Maps\n library:\n\n const { Map, RenderingType } = await google.maps.importLibrary(\"maps\");\n\n2. When initializing the map, use the `renderingType` option to specify either\n `RenderingType.VECTOR` or `RenderingType.RASTER`:\n\n map = new Map(\n document.getElementById('map'),\n {\n zoom: 4,\n center: position,\n renderingType: RenderingType.VECTOR,\n }\n );\n\nWhen the vector map rendering type is set, you must set the options for the\nneeded features.\n\n- To enable tilt, set the `tiltInteractionEnabled` map option to `true` or call `map.setTiltInteractionEnabled(true)`.\n- To enable panning, set the `headingInteractionEnabled` map option to `true` or call `map.setHeadingInteractionEnabled(true)`.\n\nFor maps loaded using the `\u003cgmp-map\u003e` element, the default rendering type is\n`google.maps.RenderingType.VECTOR`, with tilt and heading control enabled. To\nset the rendering type by using the `\u003cgmp-map\u003e` element, use the\n`rendering-type` attribute.\n\nUse a map ID to set rendering type\n----------------------------------\n\nYou can also specify the rendering type by using a map ID. To create a new map\nID, follow the steps in [Using Cloud-based Map Styling - Get a map ID](/maps/documentation/javascript/styling#creating-map-ids).\nBe sure to set the Map type to **JavaScript** , and select an option (**Vector**\nor **Raster** ). Check **Tilt** and **Rotation** to enable tilt and rotation\non the map. Doing so will allow you to programmatically adjust these values, and\nalso lets users adjust tilt and heading directly on the map. If the use of tilt\nor heading will adversely affect your app, leave **Tilt** and **Rotation** un-\nchecked so users will not be able to adjust tilt and rotation.\n\nNext, update your map initialization code with the map ID you created. You can\nfind your map IDs on the\n[Maps\nManagement](https://console.cloud.google.com/google/maps-apis/studio/maps) page. Provide a map ID when you instantiate the map using the\n`mapId` property as shown here: \n\n```javascript\nmap = new google.maps.Map(document.getElementById('map'), {\n center: {lat: -34.397, lng: 150.644},\n zoom: 8,\n mapId: '\u003cvar translate=\"no\"\u003eMAP_ID\u003c/var\u003e'\n});\n```\n| **Important:** It is recommended to associate your map ID and API key with the same Google Cloud console project."]]
