白黒のGoogleマップを出力する方法

2016/11/29アバター

白黒のグーグルマップ

白黒のGoogleマップを出力したい。と言われたので調べてみた。

サイトのデザインの問題でGoogleマップを白黒のもを出したいときってありますよね。

どうやら出来そうだ。

googlemapのjsを呼び出す際に、パラメータで色のこさを変更することで出来る。

Google Maps でスタイリッシュな白黒地図を作成する – HDRiな生活
http://hdri.iwalk.jp/2011/12/building328.php

 

こちらを参考に

白黒を作成するのでほとんどの要素を saturation:-100 に設定

 

 

他の要素も邪魔だから取りたいと言われそうなのでこちらのドキュメントも読んで置くといいかも

Googleマップをイラストマップみたいにしたい。

Googleマップをイラストマップみたいにしたい。

こちらの記事では、+や-など拡大の要素を排除する方法や

オブジェクトを置く方法も説明している。

 

文章量が多いので簡単に説明すると

Google map APIを読み込むには、

こちらのjsを読み込むことで 動くようになる。
更に、どこの座標のものを出すかという jsを加え
このjsには、パラメータが色々設定されているのでその部分をいじってあげることで色々出来るよってことです。

座標を調べる方法
任意の場所の緯度と経度の取得方法 – Google Maps API入門
http://www.ajaxtower.jp/googlemaps/gmap2/index4.html

作ってみたサンプル

サンプルデモ


     

追記。
これだけだとどこにあるのかわからなかったのでこちらの記事を見ながらポイントも置いた。
Google Map を簡単お洒落にカスタマイズ!「Styled Map Wizard」使ってみた。 | バシャログ。
http://c-brains.jp/blog/wsg/13/02/12-104000.php

スポンサーリンク

スポンサーリンク

Google」をもっと詳しく

Google

についてもっと見る

コメント大歓迎

コメントは受け付けていません。