S
S
Shuboanator2015-08-14 14:36:38
css
Shuboanator, 2015-08-14 14:36:38

Why are google maps style filters not being applied?

Why is the style filter not being applied?
The icon is displayed, the map too, but for some reason the style filters are not applied.

var map;
function initMap() {
  map = new google.maps.Map(document.getElementById('map'), {
    center: {lat: 59.211499, lng: 39.839916},
    zoom: 18,
  panControl: false,
  	zoomControl: false,
  	mapTypeControl: false,
  	scaleControl: false,
  	streetViewControl: false,
  	overviewMapControl: false
  });
  
var image = 'img/arrow1.png';
  var beachMarker = new google.maps.Marker({
    position: {lat: 59.211499, lng: 39.839916},
    map: map,
    icon: image
  });
  
 var styles = [
    {
      featureType: "labels",
      elementType: "icon",
      stylers: [
        { visibility: "off" }
      ]
    }
  ];
}

Answer the question

In order to leave comments, you need to log in

1 answer(s)
A
Alexey Zuev, 2015-08-14
@Shuboanator

And what will they be used for? I see a regular styles array , not tied to any map.
Try adding style initialization to the map.

var map;
function initMap() {
  map = new google.maps.Map(document.getElementById('map'), {
    center: {lat: 59.211499, lng: 39.839916},
    zoom: 18,
    panControl: false,
    zoomControl: false,
    mapTypeControl: false,
    scaleControl: false,
    streetViewControl: false,
    overviewMapControl: false
  });
  
var image = 'img/arrow1.png';
  var beachMarker = new google.maps.Marker({
    position: {lat: 59.211499, lng: 39.839916},
    map: map,
    icon: image
  });
  
 var styles = [
    {
      featureType: "labels",
      elementType: "icon",
      stylers: [
        { visibility: "off" }
      ]
    }
  ];

  map.setOptions({styles: styles}); // Добавить
}

Styles after that should apply, but I'm not sure about their validity .
The documentation has links to more detailed api documentation .
It clearly states what values ​​the featureType and elementType
properties can take An example of valid styles from the same documentation
var styles = [
    {
    featureType: "all",
    stylers: [
      { saturation: -80 }
    ]
  },
  {
    featureType: "road.arterial",
    elementType: "geometry",
    stylers: [
      { hue: "#00ffee" },
      { saturation: 50 }
    ]
  },
  {
    featureType: "poi.business",
    elementType: "labels",
    stylers: [
      { visibility: "off" }
    ]
  }
];

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question