記事の詳細

前回、ブログやサイトにgoogleマップを白黒で表示させる方法を説明しましたが、そこそこアクセスがあったので、googleマップ関連でもう一個書きませう!
GoogleMapをオリジナルの吹き出しにする方法なんですが、貴方のサイトに載っているマップが超簡単かつワンランク上のgoogleマップになりますよー
今回は前回より遥かに簡単です。

設置方法

上記ソースを貴方のサイトにこれ全部コピペしてください。
コピペ後は画像srcと住所書き換えてご使用してくださいね~
これ実は吹き出しの中はhtmlなんです。ですのでcssも聞くし画像も数枚張れたりします。
つまりめちゃくちゃカスタマイズできます。

動作サンプル

毎度、雑で申し訳ない動作サンプルはこちら

あとがき

そもそもgoogleマップって住所入力して発行したアイフレームのコードをコピペするだけですが、今回のように一工夫するだけでクライアントにはけっこう喜ばれる事が多いですねー
是非あなたも一工夫してワンランク上のgooglemapを目指してみてくださいまし

関連記事

    • キットカット
    • 2015年 6月 23日

    最近、検索でサイトを知り、いろいろ試させてもらってます。
    そこで、グーグルマップの表示のスクリプトも、なるほどとテストも上々。
    で、ひとつだけ気になるところの解決方法がわかれば、非常にありがたいのですが、、、
    それは、付きだしが、若干地図の上部にはみ出しているのですが、
    位置マーカーを下げるようにするには、どこを調整すれば良いのでしょうか??

    大変いきなりで、質問ということですが、よろしくお願いいたします。

    なお、検索した意図は、グーグルマップがモノクロ表示するのを、どこかのサイトで見かけてしまって、
    こういうことができるのかと、調べていてたどり着きました。

    よろしくお願いいたします。

      • AIMERS CREATE
      • 2015年 6月 23日

      コメントありがとうございます!
      サンプルを見ていただくと分かると思いますが、ピンがド真ん中にくるようになっておりますので、はみ出す場合はマップの縦幅を大きくするか、もしくは吹き出しの中の文章やテキストを小さくするなりして調整を行ってくださいませ
      よろしくどうぞ

    • キットカット
    • 2015年 6月 24日

    こんにちわ
    なるほど、そういうことか〜
    ありがとうございます。

  1. この記事へのトラックバックはありません。

AIMERS CREATEとは

AIMERS CREATEは、東京都と福岡県うきは市を中心にホームページ制作・Webデザインを行っております。 お見積もりや運営などご不明な点がありましたら、お気軽にお問い合わせメールフォームからお申込下さい。迅速に対応します。 お問い合わせをいただきましたら、電話かメールにてご連絡を致します。 AIMERS CREATEをもっと詳しく

おすすめ記事

登録されている記事はございません。

ページ上部へ戻る