TIPS & NOTE GoogleMapをモノクロに。APIを使わずにcssだけでカスタマイズ。 | Little Things

GoogleMapがいかにも地図です。 地図なので当たり前ですが、地図の色味がデザインの邪魔をしているように感じることが・・。 モノクロにしたい。 iframeを使ってシンプルに地図のみ表示させているページなので、cssだけでカスタマイズ。 cssだけでモノクロにできたよ。iframeにfilter。 埋め込んでいるiframeに対して、cssのfilterを使います。 モノクロにしたいので、grayscaleを100%に。 .googlemaps iframe, .googlemaps object, .googlemaps embed { -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filte

[misaquo]

APIのカード情報登録が必須になってから、モノクロの地図ってどうやってるんだろうって思ってたけど、CSSで行けるのか。最近コーディングしてないから分からなかったな。