Blazor项目中移除Google Maps JS API全屏/新标签功能的方法咨询
解决Blazor中Google Maps移除全屏和新标签页跳转的问题
嘿,刚好我之前处理过类似的需求,你只需要修改地图初始化时的options配置就能搞定,不用额外找其他地方的代码。下面分两种场景给你方案:
方案1:直接禁用所有默认UI控件
如果不需要保留任何Google Maps的默认控件(比如缩放按钮、全屏按钮、地图类型切换等),直接在options里添加disableDefaultUI: true即可,这样所有默认控件都会被移除,包括全屏按钮和那些会触发跳转的元素:
function initialize() { var latlng = new google.maps.LatLng(40.716948, -74.003563); var options = { zoom: 14, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP, disableDefaultUI: true // 禁用所有默认UI控件 }; var map = new google.maps.Map(document.getElementById("map"), options); }
方案2:精细控制,只移除特定功能
如果你想保留部分默认控件(比如缩放按钮),只移除全屏按钮和POI点击跳转功能,可以单独配置以下两个参数:
fullscreenControl: false:移除全屏按钮clickableIcons: false:阻止点击地图上的兴趣点(POI)时打开新标签页跳转至Google Maps官网
修改后的代码如下:
function initialize() { var latlng = new google.maps.LatLng(40.716948, -74.003563); var options = { zoom: 14, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP, fullscreenControl: false, // 移除全屏按钮 clickableIcons: false // 禁止POI点击跳转新标签页 }; var map = new google.maps.Map(document.getElementById("map"), options); }
另外要注意:根据Google Maps的使用条款,你不能移除地图上的Google logo和版权信息,所以这部分是无法通过配置隐藏的,这点需要留意~
内容的提问来源于stack exchange,提问作者George Harrison




