Googleマップのマーカーをアイコンに変える方法Googleマップのマーカーをアイコンに変える方法Googleマップに設置するマーカーをアイコンに変更しますGoogleマップで詳細の位置を示すマーカー。そのままでも詳細な場所は解りますが遊び心で会社のロゴマークやかわいいアイコンに変更すると、より「自社感」が増し見た目も楽しくなります。Googleマップを設置する際は、デザインによってアイコン設置の方がサイトコンセプトに合わせてマーカーかアイコンを選ぶのもいいと思います。サンプルはこちらマップの設置方法マップの設置方法は以前の記事を確認してください。Googleマップをブラウザ全部に表示する方法アイコン設置を含めたマップのコード下記はマーカーを含めたGoogleマップの設置コードです。google.maps.Marker(markerOptions);}</script>アイコン設置部分は以下の部分です。画像は「.png」で背景を透過して作ってください。画像は下記の部分のパスを変更して読み込みます。google.maps.Size」は画像の縦・横サイズ(px)を入力します。google.maps.Point」はアイコンの中心位置(吹き出しの中心)を入力します。サンプルでは左から19pxの位置が吹き出しの中心になっています。google.maps.Point(19,51)設置完了これでアイコンが設置されました。アイコンは設置以外にも色々遊べるのでまたの機会にご紹介できたらと思います。ブラウザ人気の記事アプリ「インスタグラム」でハッシュタグを入れても表示されない現象についてレスポンシブWebデザインサイトを作る時に必要なデバイスのモニターサイズをまとめましたCSSで背景画像を100%で表示する方法をまとめました背景をrgbaで設定した時にIE8以下で透過する方法レスポンシブの設定対応が変わる?iPhone6/iPhone6+の画面サイズを調べてみましたイラストレーターでランダムなパターンを作る方法googleマップAPIを設置した時にマウスホイールでズームするのを無効化する方法CSSを使ってマウスオーバーした時に画像をゆっくりとフェードイン・アウトさせる方法Googlemapを設置する時に建物名やカテゴリーアイコンなど全て非表示にしてスタリッシュなマップを作る方法YouTubeでお気に入りリスト(再生リスト)を作成・削除する方法トップページこのサイトについてブログWebラボお問い合わせサイトマップリンクこのページを共有するhtml5・css・jquery・WordPressなどWeb制作やイラスト、アニメーションに関する記事を掲載しています©2014yoshikiminatoya.com。