如何在Google Maps API中移除地图经纬线?附现有代码求助
解决Google Maps API移除经纬线同时保留国家边界的方法
要移除地图上的经纬线且不影响国家边界,你需要利用Google Maps样式规则的优先级(后定义的规则会覆盖先定义的),针对性地隐藏经纬线并保留国家边界。
具体做法是:
- 先将全局
administrative的geometry设为off,隐藏包括经纬线在内的所有行政几何元素 - 再单独将
administrative.country的geometry设为on,重新显示国家边界
修改后的完整代码如下:
guessMap = new google.maps.Map(document.getElementById("guessMap"), { center: { lat: 0, lng: 0 }, zoom: 2, streetViewControl: false, mapTypeControl: false, fullscreenControl: false, minZoom: 2, // Minimalny zoom maxZoom: 15, // Maksymalny zoom restriction: { // Ograniczenia geograficzne latLngBounds: { north: 85, south: -85, east: 180, west: -180, }, strictBounds: true, }, styles: [ // Styl mapy { "featureType": "administrative", "elementType": "geometry", "stylers": [{ "visibility": "off" }] // 先隐藏所有行政几何元素(含经纬线) }, { "featureType": "administrative.country", "elementType": "geometry", "stylers": [{ "visibility": "on" }] // 重新显示国家边界 }, { "featureType": "landscape", "elementType": "geometry", "stylers": [{ "visibility": "on" }] }, { "featureType": "poi", "elementType": "labels", "stylers": [{ "visibility": "on" }] }, { "featureType": "road", "elementType": "geometry", "stylers": [{ "visibility": "on" }] }, { "featureType": "transit", "elementType": "labels", "stylers": [{ "visibility": "on" }] }, { "featureType": "water", "elementType": "geometry", "stylers": [{ "visibility": "on" }] }, { "featureType": "administrative.land_parcel", "elementType": "geometry", "stylers": [{ "visibility": "off" }] }, { "featureType": "administrative.locality", "elementType": "labels", "stylers": [{ "visibility": "on" }] }, { "featureType": "administrative.neighborhood", "elementType": "labels", "stylers": [{ "visibility": "on" }] }, { "featureType": "administrative.province", "elementType": "labels", "stylers": [{ "visibility": "on" }] } ] });
原理说明:Google Maps的经纬线属于administrative分类下的通用几何元素,而国家边界是administrative.country子分类的几何元素。通过先隐藏全局行政几何、再单独启用国家边界的方式,就能精准实现需求,不会影响其他地图元素的显示。
内容的提问来源于stack exchange,提问作者gapi
相关产品推荐
相关产品推荐

