跨瀏覽器灰度不工作

Question

所以我有這個谷歌地圖需要對它有黑色和白色的影響，它在下面的鉻，邊緣和firefox，但Safari瀏覽器，並且它是一個不行。

最初我的CSS看起來像下面，我環顧四周，人們說的唯一真正的解決方案是過濾器：url（'....'）但對我來說它不起作用。任何一個解決方案將不勝感激。 p.s我寧願如果這是用css來完成的，任何人都可以用api來完成，我寧願不要沿着這條路線走。

#LocationMap { 
width: 100%; 
height: 400px; 
float: left; 
filter: url(data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter i…0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale); 
filter: gray; 
-webkit-filter: grayscale(100%); 
-webkit-transition: all .6s ease; 
-webkit-backface-visibility: hidden; 
box-shadow: inset 0px 0px 0 2000px rgba(0,0,0,0.5); 
} 

Answer 1

您可以使用樣式的地圖，爲實施此信息： https://developers.google.com/maps/documentation/javascript/styling

如果你願意，你可以找到噸準備好作風在這裏： https://snazzymaps.com/