Koleksiyonlar ile düzeninizi koruyun
İçeriği tercihlerinize göre kaydedin ve kategorilere ayırın.
Bu sayfada, vektör haritalar ve WebGL özellikleri ile ilgili bilinen sorunlar ve geçici çözümler listelenmektedir.
Tarayıcı/cihaz desteği
WebGL özellik önizlemesi, Maps JavaScript API ile aynı tarayıcıları ve cihazları destekler.
Belirli bir cihazdaki tarayıcının WebGL'yi destekleyip desteklemediğini kontrol etmek için get.webgl.org veya caniuse.com adresini ziyaret edin. Lütfen tarayıcı ayarlarında donanım hızlandırmanın etkinleştirildiğinden de emin olun. Aksi takdirde vektör haritalar raster'a geri döner.
Raster mı vektör mü?
Bazen vektör haritalar raster haritaya geri dönebilir. Bu durumda, vektör haritaya bağlı özellikler kullanılamaz. Çeşitli nedenlerle raster haritaya geri dönüş yapılabilir. Bu bölümde, web tarayıcınızı nasıl doğru şekilde yapılandıracağınız ve vektör harita özelliğinin mevcut olup olmadığını programatik olarak nasıl kontrol edeceğiniz gösterilmektedir.
Chrome'da tarayıcı özelliklerini kontrol etme
Chrome'un belirli bir yüklemesinde hangi donanım hızlandırma özelliklerinin etkin olduğunu belirlemek için chrome://gpu/ adresine gidin ve aşağıdaki öğelerin etkin (yeşil renkte) olduğundan emin olun:
"OpenGL: Etkin"
"WebGL: Donanım hızlandırmalı"
"WebGL2: Donanım hızlandırmalı"
(Bunlar yalnızca temel şartlardır. Desteği etkileyen başka faktörler de olabilir. Aşağıdaki "Bilinen hatalar" bölümüne bakın.)
Donanım hızlandırmayı etkinleştirme
Vektör haritaların desteklenmesi için çoğu tarayıcıda donanım hızlandırma etkinleştirilmelidir. Chrome ve Microsoft Edge'de donanım hızlandırmayı etkinleştirmek için Ayarlar'ı açın, Sistem'i seçin ve Kullanılabilir olduğunda donanım hızlandırmayı kullan seçeneğinin etkinleştirildiğinden emin olun.
Raster veya vektör olup olmadığını programatik olarak kontrol etme
map.getRenderingType() işlevini çağırarak bir haritanın raster mi yoksa vektör mü olduğunu programatik olarak kontrol edebilirsiniz. Aşağıdaki örnekte, renderingtype_changed etkinliğini izlemek ve raster veya vektör haritanın kullanılıp kullanılmadığını gösteren bir bilgi penceresi görüntülemek için kullanılan kod gösterilmektedir.
TypeScript
/** * This example creates a map with an info window that shows whether * the map render type is raster or vector. */functioninitMap(){constcenter={lat:0,lng:0};constmap=newgoogle.maps.Map(document.getElementById('map')asHTMLElement,{center,zoom:10,heading:0.0,tilt:0.0,// Map ID for a vector map.mapId:'6ff586e93e18149f',});constcanvas=document.createElement("canvas");constinfoWindow=newgoogle.maps.InfoWindow({content:'',ariaLabel:'Raster/Vector',position:center,});infoWindow.open({map,});map.addListener('renderingtype_changed',()=>{infoWindow.setContent(`${map.getRenderingType()}`);});}declareglobal{interfaceWindow{initMap:()=>void;}}window.initMap=initMap;
/** * This example creates a map with an info window that shows whether * the map render type is raster or vector. */functioninitMap(){constcenter={lat:0,lng:0};constmap=newgoogle.maps.Map(document.getElementById("map"),{center,zoom:10,heading:0.0,tilt:0.0,// Map ID for a vector map.mapId:"6ff586e93e18149f",});constcanvas=document.createElement("canvas");constinfoWindow=newgoogle.maps.InfoWindow({content:"",ariaLabel:"Raster/Vector",position:center,});infoWindow.open({map,});map.addListener("renderingtype_changed",()=>{infoWindow.setContent(`${map.getRenderingType()}`);});}window.initMap=initMap;
Vektör haritalar için mobil web desteği hâlâ deneyseldir. Geliştiriciler, mobil web tarayıcılarını algılamak için istemci API'lerini kullanabilir ve vektör harita yerine raster haritayla ilişkili bir harita kimliği kullanabilir. Bazı mobil cihazlarda daha yavaş bir oluşturma performansı bekliyoruz. Mobil web'de vektör haritaları kullanmayı tercih ederseniz performans istatistiklerini ve geri bildirimlerinizi bizimle paylaşmanızı rica ederiz. Yukarıda belirtildiği gibi, vektör harita desteği yoksa vektör harita kimliği otomatik olarak raster harita kullanmaya geri döner.
Hatalar
Bilinen hatalar
AMD GPU'lu bazı macOS cihazlarda Chrome'la ilgili bilinen bir sorun var. Bu durum, macOS'in birden fazla GPU'ya sahip cihazlarda GPU'lar arasında dinamik olarak geçiş yaptığında özellikle kafa karıştırıcı olabilir. Bu nedenle, hangi uygulamaların çalıştığına veya harici bir monitörün bağlı olup olmadığına bağlı olarak vektör haritalar kullanılamayabilir.
Chrome'un yakında kullanıma sunulacak ANGLE Metal arka ucunu etkinleştirmek, bazı durumlarda bu sorunu düzeltiyor. Bu özellik için genel kullanıma sunma planlarını https://bugs.chromium.org/p/chromium/issues/detail?id=1322521 adresinden takip edebilirsiniz.
Hata bildirme
Lütfen hatayı bildirmeden önce tarayıcıyı ve GPU sürücüsünü en son sürüme güncelleyin.
chrome://settings/system (Chrome), about:preferences#general (Firefox), edge://settings/system (Microsoft Edge) adresindeki donanım hızlandırma ayarının etkin olduğundan emin olun. Safari'de bu ayar, macOS 10.15 veya sonraki sürümlerde otomatik olarak etkinleştirilir. Daha eski MacOS sürümlerinde lütfen Safari'nin gelişmiş ayarlarına gidin ve "Donanım hızlandırmayı kullan" seçeneğinin etkinleştirildiğinden emin olun.
Hata raporuna jsfiddle örnek kod bağlantısını ekleyin.
Lütfen chrome://gpu (Chrome), about:support (Firefox) veya edge://gpu (Microsoft Edge) tarayıcısının ekran görüntüsünü de alın. Oluşturma sorunlarıyla karşılaşırsanız hata raporuna GPU ile ilgili bilgileri ekleyin.
Düşüncelerinizi bizimle paylaşın
Sizin ve son kullanıcılarınız için en iyi vektör harita deneyimini sunmaya çalışırken geri bildirimlerinizi dikkate alıyoruz. Lütfen aşağıdaki durumlarda bize bildirin:
Web uygulamalarınızda tespit ettiğiniz yeni JavaScript hataları veya hatalar/kilitlenmeler varsa
Vektör haritaların başlangıç gecikmesi, raster haritaların başlangıç gecikmesinden önemli ölçüde daha kötüdür. Bu durumda, başlangıç gecikmesi regresyonuyla ilgili metrikler çok faydalıdır. Genel olarak, başlangıç gecikmesinin kabul edilebilir eşiklerin ötesine gerileyip gerilemediğini öğrenmek istiyoruz.
Vektör haritalar deneyimi, olabileceği kadar sorunsuz değil. FPS veya jank metriklerini kaydediyorsanız bu metrikler vektör ve raster haritalar arasında nasıl karşılaştırılır?
Performans tarayıcıya göre büyük ölçüde farklılık gösterir.
Vektör haritalar ile raster haritaların karşılaştırılması için A/B testi ayarladıysanız lütfen elde ettiğiniz performans geri bildirimlerini paylaşın. Bu geri bildirimler, özelliği iyileştirmemize yardımcı olacağı için çok faydalı olacaktır.
[[["Anlaması kolay","easyToUnderstand","thumb-up"],["Sorunumu çözdü","solvedMyProblem","thumb-up"],["Diğer","otherUp","thumb-up"]],[["İhtiyacım olan bilgiler yok","missingTheInformationINeed","thumb-down"],["Çok karmaşık / çok fazla adım var","tooComplicatedTooManySteps","thumb-down"],["Güncel değil","outOfDate","thumb-down"],["Çeviri sorunu","translationIssue","thumb-down"],["Örnek veya kod sorunu","samplesCodeIssue","thumb-down"],["Diğer","otherDown","thumb-down"]],["Son güncelleme tarihi: 2025-09-05 UTC."],[[["\u003cp\u003eThis page addresses known issues and workarounds for vector maps and WebGL features in Google Maps.\u003c/p\u003e\n"],["\u003cp\u003eHardware acceleration must be enabled in your browser settings for vector maps to function correctly; instructions for various browsers are provided.\u003c/p\u003e\n"],["\u003cp\u003eYou can programmatically determine if a map is rendering in vector or raster mode using the \u003ccode\u003emap.getRenderingType()\u003c/code\u003e method.\u003c/p\u003e\n"],["\u003cp\u003eThere are known issues with vector maps on certain macOS devices with AMD GPUs in Chrome, potentially due to dynamic GPU switching.\u003c/p\u003e\n"],["\u003cp\u003eFeedback on performance, bugs, and user experience with vector maps is encouraged to help improve the feature.\u003c/p\u003e\n"]]],["This document details vector map and WebGL feature support, troubleshooting, and usage. Key actions include: checking browser support via `get.webgl.org` or `caniuse.com`; enabling hardware acceleration in browser settings; using `chrome://gpu/` to verify hardware acceleration in Chrome; and programmatically checking for raster or vector maps using `map.getRenderingType()`. The document also covers mobile web support limitations, known bugs, and how to report them, including updating browsers/drivers and providing relevant diagnostic information.\n"],null,["# Support\n\nThis page lists known issues and workarounds for vector maps and WebGL features.\n\nBrowser/device support\n----------------------\n\nThe WebGL feature preview supports the same browsers and devices as the Maps JavaScript API.\nTo check whether the browser on a particular device will support WebGL, visit [get.webgl.org](https://get.webgl.org/)\nor [caniuse.com](https://caniuse.com/?search=webgl). Please also ensure the\nhardware acceleration is enabled in the browser settings, otherwise vector maps\nwill revert to [raster](#raster-fallback).\n\nRaster or vector?\n-----------------\n\nOccasionally, a vector map may fall back to raster. When this happens, features\ndepending on the vector map are unavailable. Fallback to a raster map may occur\nfor a variety of reasons. This section shows you how to correctly configure\nyour web browser, and how to programmatically check whether vector map\ncapability is present.\n\n### Check browser capabilities on Chrome\n\nTo determine which hardware acceleration capabilities are enabled in a specific\ninstallation of Chrome, navigate to \u003cchrome://gpu/\u003e, and ensure\nthat the following items are enabled (in green):\n\n- \"OpenGL: Enabled\"\n- \"WebGL: Hardware accelerated\"\n- \"WebGL2: Hardware accelerated\"\n\n(These are just baseline requirements, there can be other factors which\nimpact support, see \"Known bugs\" below.)\n\n### Enable hardware acceleration\n\nIn order to support vector maps, hardware acceleration must be enabled in most\nbrowsers. To enable hardware acceleration in Chrome and Microsoft Edge, open\n**Settings** , select **System** , and ensure that **Use hardware acceleration\nwhen available** is enabled.\n\n- Learn how to [change websites preferences in Safari](https://support.apple.com/guide/safari/websites-ibrwe2159f50/14.0/mac/11.0).\n- Learn about [Firefox's performance settings](https://support.mozilla.org/en-US/kb/performance-settings).\n\n### Programmatically check for raster or vector\n\nYou can programmatically check to see whether a map is raster or vector, by\ncalling `map.getRenderingType()`. The following example shows code to monitor\nthe `renderingtype_changed` event, and show an info window displaying whether a\nraster or vector map is in use.\n\n\n### TypeScript\n\n```typescript\n/**\n * This example creates a map with an info window that shows whether\n * the map render type is raster or vector.\n */\n\n function initMap() {\n const center = {lat: 0, lng: 0};\n const map = new google.maps.Map(document.getElementById('map') as HTMLElement, {\n center,\n zoom: 10,\n heading: 0.0,\n tilt: 0.0,\n // Map ID for a vector map.\n mapId: '6ff586e93e18149f',\n });\n const canvas = document.createElement(\"canvas\");\n const infoWindow = new google.maps.InfoWindow({\n content: '',\n ariaLabel: 'Raster/Vector',\n position: center,\n });\n infoWindow.open({\n map,\n });\n\n map.addListener('renderingtype_changed', () =\u003e {\n infoWindow.setContent(`${map.getRenderingType()}`);\n });\n }\n\n declare global {\n interface Window {\n initMap: () =\u003e void;\n }\n }\n window.initMap = initMap;https://github.com/googlemaps/js-samples/blob/2683f7366fb27829401945d2a7e27d77ed2df8e5/samples/vector-detector/index.ts#L8-L43\n```\n| **Note:** Read the [guide](/maps/documentation/javascript/using-typescript) on using TypeScript and Google Maps.\n\n### JavaScript\n\n```javascript\n/**\n * This example creates a map with an info window that shows whether\n * the map render type is raster or vector.\n */\nfunction initMap() {\n const center = { lat: 0, lng: 0 };\n const map = new google.maps.Map(document.getElementById(\"map\"), {\n center,\n zoom: 10,\n heading: 0.0,\n tilt: 0.0,\n // Map ID for a vector map.\n mapId: \"6ff586e93e18149f\",\n });\n const canvas = document.createElement(\"canvas\");\n const infoWindow = new google.maps.InfoWindow({\n content: \"\",\n ariaLabel: \"Raster/Vector\",\n position: center,\n });\n\n infoWindow.open({\n map,\n });\n map.addListener(\"renderingtype_changed\", () =\u003e {\n infoWindow.setContent(`${map.getRenderingType()}`);\n });\n}\n\nwindow.initMap = initMap;https://github.com/googlemaps/js-samples/blob/2683f7366fb27829401945d2a7e27d77ed2df8e5/dist/samples/vector-detector/docs/index.js#L7-L36\n```\n\n\u003cbr /\u003e\n\nYou can also use the WebGL rendering context to check support for WebGL 2: \n\n const canvas = document.createElement(\"canvas\");\n canvas.getContext(\"webgl2\") ? console.log(\"WebGL 2 is supported\") : console.log(\"WebGL 2 is NOT supported\");\n\nLearn other ways to [programmatically detect WebGL rendering context](https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API/By_example/Detect_WebGL).\n\nMobile web support\n------------------\n\nMobile web support for vector maps is still experimental. Developers can use\nclient APIs to detect mobile web browsers and use a map ID associated with a\nraster map instead of a vector map. We anticipate slower rendering performance\nfor some mobile devices. If you choose to use vector maps on mobile web, we\nwould greatly appreciate performance statistics and feedback. As above, if\nVector Maps support is not available, a vector map ID will automatically\nfallback to using a raster map.\n\nBugs\n----\n\n### Known bugs\n\n- There is a known issue in Chrome on some macOS devices with AMD GPUs. This can be particularly confusing when macOS dynamically switches between GPUs on devices with multiple GPUs, so vector maps may not be available depending on what other apps are running, or whether an external monitor is connected. Turning on Chrome's upcoming ANGLE Metal backend appears to fix this issue in some cases. You can follow general rollout plans for this at \u003chttps://bugs.chromium.org/p/chromium/issues/detail?id=1322521\u003e.\n\n### Reporting bugs\n\n- Please update the browser and GPU driver to the latest version before reporting the bug.\n- Ensure that the hardware acceleration setting at `chrome://settings/system` (Chrome), `about:preferences#general` (Firefox), `edge://settings/system` (Microsoft Edge) is enabled. In Safari, this setting is enabled automatically in macOS version 10.15 or newer. For older MacOS version(s), please go to the Safari advanced settings and ensure that the \"Use hardware acceleration\" option is enabled.\n- Include [jsfiddle](https://jsfiddle.net/L320szg9/) sample code link in the bug report.\n- Please also take a screenshot of `chrome://gpu` (Chrome), `about:support` (Firefox) or `edge://gpu` (Microsoft Edge), attach GPU related info in bug report if you encounter any rendering issues.\n\nTell us what you think!\n-----------------------\n\nWe value your feedback as we strive to make the best vector map experience for\nyou and your end-users. Please let us know if:\n\n- There are any new JavaScript errors or bugs/crashes that you detect in your web apps.\n- Startup latency for vector maps is significantly worse than that for raster maps. If this is the case, metrics for startup latency regression are very helpful. In general, we want to know if startup latency regresses beyond acceptable thresholds.\n- The vector maps experience is not as smooth as it could be. If you log FPS or jank metrics, how do they compare between vector and raster maps?\n- Performance differs greatly by browser.\n\nIf you have set up A/B testing for a comparison of vector maps vs. raster maps,\nplease share any performance feedback you acquire, as this will be very useful\nto help us refine the feature."]]
