我有一个自定义主题json，用于设置Google地图的样式。应用样式后，标签会因笔触效果而变得模糊。
我要禁用标签的笔触效果！
尝试关闭 labels.text.stroke 的可见性，如下所示：
{
"featureType": "poi.attraction",
"elementType": "labels.text.stroke",
"stylers": [
{
"visibility": "off"
}
]
}
它不起作用。标签仍具有所有POI的笔划
当我导入 mapstyle.withgoogle.com 时使用相同的json，它有效，没有笔触效果：-/
使用此JSFiddle link复制!!!
这是使用JSON Im的
[
{
"elementType": "geometry",
"stylers": [
{
"color": "#3e3e3e"
}
]
},
{
"elementType": "geometry.stroke",
"stylers": [
{
"visibility": "off"
}
]
},
{
"elementType": "labels.icon",
"stylers": [
{
"visibility": "off"
}
]
},
{
"elementType": "labels.text",
"stylers": [
{
"color": "#808080"
},
{
"visibility": "on"
}
]
},
{
"elementType": "labels.text.stroke",
"stylers": [
{
"visibility": "off"
}
]
},
{
"featureType": "administrative.land_parcel",
"stylers": [
{
"visibility": "off"
}
]
},
{
"featureType": "landscape.man_made",
"elementType": "geometry.fill",
"stylers": [
{
"color": "#3e3e3e"
}
]
},
{
"featureType": "landscape.man_made",
"elementType": "geometry.stroke",
"stylers": [
{
"color": "#808080"
},
{
"visibility": "on"
}
]
},
{
"featureType": "landscape.natural",
"elementType": "geometry.fill",
"stylers": [
{
"color": "#4d583c"
}
]
},
{
"featureType": "landscape.natural.terrain",
"elementType": "geometry.fill",
"stylers": [
{
"color": "#404633"
},
{
"visibility": "on"
}
]
},
{
"featureType": "poi",
"elementType": "geometry.fill",
"stylers": [
{
"visibility": "off"
}
]
},
{
"featureType": "poi",
"elementType": "geometry.stroke",
"stylers": [
{
"color": "#808080"
},
{
"visibility": "on"
}
]
},
{
"featureType": "poi.park",
"elementType": "geometry.fill",
"stylers": [
{
"color": "#495338"
},
{
"visibility": "on"
}
]
},
{
"featureType": "poi.sports_complex",
"elementType": "geometry.fill",
"stylers": [
{
"color": "#536041"
},
{
"visibility": "on"
}
]
},
{
"featureType": "road",
"elementType": "geometry.fill",
"stylers": [
{
"color": "#363636"
}
]
},
{
"featureType": "road.arterial",
"elementType": "geometry",
"stylers": [
{
"color": "#363636"
}
]
},
{
"featureType": "road.highway",
"elementType": "geometry",
"stylers": [
{
"color": "#252525"
}
]
},
{
"featureType": "road.highway.controlled_access",
"elementType": "geometry",
"stylers": [
{
"color": "#252525"
}
]
},
{
"featureType": "transit.line",
"elementType": "geometry.fill",
"stylers": [
{
"color": "#363636"
}
]
},
{
"featureType": "transit.station",
"elementType": "geometry",
"stylers": [
{
"color": "#3e3e3e"
}
]
},
{
"featureType": "water",
"elementType": "geometry",
"stylers": [
{
"color": "#204157"
}
]
},
{
"featureType": "water",
"elementType": "geometry.fill",
"stylers": [
{
"color": "#204157"
}
]
},
{
"featureType": "poi.attraction",
"elementType": "labels.text.stroke",
"stylers": [
{
"visibility": "off"
}
]
},
{
"featureType": "poi.government",
"elementType": "labels.text.stroke",
"stylers": [
{
"visibility": "off"
}
]
},
{
"featureType": "poi.business",
"elementType": "labels.text.stroke",
"stylers": [
{
"visibility": "off"
}
]
},
{
"featureType": "poi.medical",
"elementType": "labels.text.stroke",
"stylers": [
{
"visibility": "off"
}
]
},
{
"featureType": "poi.park",
"elementType": "labels.text.stroke",
"stylers": [
{
"visibility": "off"
}
]
},
{
"featureType": "poi.place_of_worship",
"elementType": "labels.text.stroke",
"stylers": [
{
"visibility": "off"
}
]
},
{
"featureType": "poi.school",
"elementType": "labels.text.stroke",
"stylers": [
{
"visibility": "off"
}
]
},
{
"featureType": "poi.sports_complex",
"elementType": "labels.text.stroke",
"stylers": [
{
"visibility": "off"
}
]
},
{
"featureType": "poi.attraction",
"stylers": [
{
"visibility": "on"
}
]
},
{
"featureType": "poi.government",
"stylers": [
{
"visibility": "on"
}
]
},
{
"featureType": "poi.business",
"stylers": [
{
"visibility": "on"
}
]
},
{
"featureType": "poi.medical",
"stylers": [
{
"visibility": "on"
}
]
},
{
"featureType": "poi.place_of_worship",
"stylers": [
{
"visibility": "on"
}
]
},
{
"featureType": "poi.park",
"stylers": [
{
"visibility": "on"
}
]
},
{
"featureType": "poi.school",
"stylers": [
{
"visibility": "on"
}
]
},
{
"featureType": "poi.sports_complex",
"stylers": [
{
"visibility": "on"
}
]
}
]
答案 0 :(得分：0)
您发布的JSON中某些元素的顺序必须存在问题。正如我在评论中所说，其中有些多余的行也应该删除。
在您提到的工具中导入JSON并再次将其导出即可解决此问题。
var map;
function initialize() {
var customStyle = [{
"elementType": "geometry",
"stylers": [{
"color": "#3e3e3e"
}]
},
{
"elementType": "geometry.stroke",
"stylers": [{
"visibility": "off"
}]
},
{
"elementType": "labels.icon",
"stylers": [{
"visibility": "off"
}]
},
{
"elementType": "labels.text",
"stylers": [{
"color": "#808080"
}]
},
{
"elementType": "labels.text.stroke",
"stylers": [{
"visibility": "off"
}]
},
{
"featureType": "administrative.land_parcel",
"stylers": [{
"visibility": "off"
}]
},
{
"featureType": "landscape.man_made",
"elementType": "geometry.fill",
"stylers": [{
"color": "#3e3e3e"
}]
},
{
"featureType": "landscape.man_made",
"elementType": "geometry.stroke",
"stylers": [{
"color": "#808080"
},
{
"visibility": "on"
}
]
},
{
"featureType": "landscape.natural",
"elementType": "geometry.fill",
"stylers": [{
"color": "#4d583c"
}]
},
{
"featureType": "landscape.natural.terrain",
"elementType": "geometry.fill",
"stylers": [{
"color": "#404633"
},
{
"visibility": "on"
}
]
},
{
"featureType": "poi",
"elementType": "geometry.fill",
"stylers": [{
"visibility": "off"
}]
},
{
"featureType": "poi",
"elementType": "geometry.stroke",
"stylers": [{
"color": "#808080"
},
{
"visibility": "on"
}
]
},
{
"featureType": "poi.attraction",
"stylers": [{
"visibility": "on"
}]
},
{
"featureType": "poi.attraction",
"elementType": "labels.text.stroke",
"stylers": [{
"visibility": "off"
}]
},
{
"featureType": "poi.business",
"stylers": [{
"visibility": "on"
}]
},
{
"featureType": "poi.business",
"elementType": "labels.text.stroke",
"stylers": [{
"visibility": "off"
}]
},
{
"featureType": "poi.government",
"stylers": [{
"visibility": "on"
}]
},
{
"featureType": "poi.government",
"elementType": "labels.text.stroke",
"stylers": [{
"visibility": "off"
}]
},
{
"featureType": "poi.medical",
"stylers": [{
"visibility": "on"
}]
},
{
"featureType": "poi.medical",
"elementType": "labels.text.stroke",
"stylers": [{
"visibility": "off"
}]
},
{
"featureType": "poi.park",
"stylers": [{
"visibility": "on"
}]
},
{
"featureType": "poi.park",
"elementType": "geometry.fill",
"stylers": [{
"color": "#495338"
},
{
"visibility": "on"
}
]
},
{
"featureType": "poi.park",
"elementType": "labels.text.stroke",
"stylers": [{
"visibility": "off"
}]
},
{
"featureType": "poi.place_of_worship",
"stylers": [{
"visibility": "on"
}]
},
{
"featureType": "poi.place_of_worship",
"elementType": "labels.text.stroke",
"stylers": [{
"visibility": "off"
}]
},
{
"featureType": "poi.school",
"stylers": [{
"visibility": "on"
}]
},
{
"featureType": "poi.school",
"elementType": "labels.text.stroke",
"stylers": [{
"visibility": "off"
}]
},
{
"featureType": "poi.sports_complex",
"stylers": [{
"visibility": "on"
}]
},
{
"featureType": "poi.sports_complex",
"elementType": "geometry.fill",
"stylers": [{
"color": "#536041"
},
{
"visibility": "on"
}
]
},
{
"featureType": "poi.sports_complex",
"elementType": "labels.text.stroke",
"stylers": [{
"visibility": "off"
}]
},
{
"featureType": "road",
"elementType": "geometry.fill",
"stylers": [{
"color": "#363636"
}]
},
{
"featureType": "road.arterial",
"elementType": "geometry",
"stylers": [{
"color": "#363636"
}]
},
{
"featureType": "road.highway",
"elementType": "geometry",
"stylers": [{
"color": "#252525"
}]
},
{
"featureType": "road.highway.controlled_access",
"elementType": "geometry",
"stylers": [{
"color": "#252525"
}]
},
{
"featureType": "transit.line",
"elementType": "geometry.fill",
"stylers": [{
"color": "#363636"
}]
},
{
"featureType": "transit.station",
"elementType": "geometry",
"stylers": [{
"color": "#3e3e3e"
}]
},
{
"featureType": "water",
"elementType": "geometry",
"stylers": [{
"color": "#204157"
}]
},
{
"featureType": "water",
"elementType": "geometry.fill",
"stylers": [{
"color": "#204157"
}]
}
];
var mapOptions = {
center: new google.maps.LatLng(59.32522, 18.07002),
zoom: 10,
styles: customStyle
};
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
}
initialize();#map-canvas {
height: 200px;
}<div id="map-canvas"></div>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk"></script>