Question

我只想在google maps api中显示城区名称。我现在可以看到地图中所有标签名称的可见性，但我想显示城区名称，这些名称通常在普通Google地图中以更高的缩放级别显示。

也许您可以将标签名称的可见性设置为某个缩放级别，例如在缩放级别11之后将它们打开？这样的事情可能吗？

提前致谢！

var mapProp = {
    center: new google.maps.LatLng(52.368465, 4.903921),
    zoom: 11,
    styles: [{
        'featureType': 'all',
        'elementType': 'labels',
        'stylers': [{
            'visibility': 'off'
        }]
    }, {
        'featureType': 'transit',
        'elementType': 'labels',
        'stylers': [{
            'visibility': 'off'
        }]
    }, {
        'featureType': 'poi',
        'elementType': 'labels',
        'stylers': [{
            'visibility': 'off'
        }]
    }, {
        'featureType': 'water',
        'elementType': 'labels',
        'stylers': [{
            'visibility': 'off'
        }]
    }, {
        'featureType': 'road',
        'elementType': 'labels.icon',
        'stylers': [{
            'visibility': 'off'
        }]
    }, {
        'stylers': [{
            'hue': '#00aaff'
        }, {
            'saturation': -50
        }, {
            'gamma': 1.15
        }, {
            'lightness': 12
        }]
    }, {
        'featureType': 'road',
        'elementType': 'labels.text.fill',
        'stylers': [{
            'visibility': 'on'
        }, {
            'lightness': 24
        }]
    }, {
        'featureType': 'road',
        'elementType': 'geometry',
        'stylers': [{
            'lightness': 85
        }]
    }],
    streetViewControl: false,
    panControl: false,
    mapTypeControl: false,
    mapTypeId: google.maps.MapTypeId.ROAD
};

Answer 1

我创建了2个变量lowLevelStyles和highLevelStyles，其中包含您要应用的不同样式，具体取决于缩放级别。然后按照上面评论中的建议在zoom_changed上创建一个监听器。然后，您可以根据缩放级别应用这些样式：

google.maps.event.addListener(map, 'zoom_changed', function () {

    var zoomLevel = map.getZoom();
    document.getElementById('zoomLevel').innerHTML = 'Zoom Level: ' + zoomLevel;

    if (zoomLevel > 10) {
        map.setOptions(highLevelStyles);
    } else {
        map.setOptions(lowLevelStyles);
    }
});

JSFiddle

检查以上链接是否有工作演示。

仅在Google Maps Api中显示城市地区名称

1 个答案: