GoogleMapの簡単な埋め込み方法。アイコンやデザインのカスタマイズも！ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
どうもです、はやちです(◞‸◟) いきなりですがみなさん、せっかくデザインされたWebサイトの中にデフォルトのGoogleマップがあるとなんだかもったいなく感じませんか？(◞‸◟) どーにかこれをうまくデザインできないだろうか(◞‸◟) ということで、今回は簡単にGoogleマップのデザインをカスタマイズできる方法をご紹介したいと思います٩( ᐛ )و Googleマップを表示させよう まずはじめに基本から。Googleマップを設置しましょう( ˘ω˘)☝ Googleマップの設置 <script src="http://maps.google.com/maps/api/js?key=ここにAPIキーを入れます&language=ja"> </script> headerタグAPIを取得するスクリプトをつけます。 APIの取得はこちらをご参照ください <div id="js-map-tae
Google Maps API v3を使ってウェブサイトやブログに地図を表示する
Google Maps API v3を使ってウェブサイトやブログに地図を表示する方法を紹介します。 本エントリーではGoogleマップの基本的な表示するために必要な、下記の手順について説明します。 APIキーの取得 Googleマップの表示 中心地点の設定 縮尺の設定 １．APIキーの取得 Google APIコンソールのページを開いて、Google アカウントでログインし、表示された画面の左メニューにある「APIs & auth」をクリック。 APIの一覧が表示されるので、「Google Maps JavaScript API v3」の右側にある「OFF」をクリック。 サービス利用規約に同意する場合はチェックボックスをチェックして「Accept」をクリック。 （クリックで拡大） 「Google Maps JavaScript API v3」のSTATUSが「ON」になったことを確認。 「
男鹿なびについて | 男鹿なび
男鹿なびの運営体制について 男鹿なびは、地元男鹿の民間企業「株式会社男鹿なび」が運営する秋田県男鹿エリアの観光情報サイトです。多くの情報は、男鹿なびスタッフが取材・調査した自らの主観で紹介しています。さらに男鹿市役所や男鹿市観光協会等の公的機関や民間企業と情報共有し、男鹿観光に関するあらゆる情報を提供できるような運営をしています。 男鹿なびは、地元民として「自分が本当に良いと思うもの」を観光客の皆様に自信を持っておススメすることを大事にしています。全ての人が男鹿なびの中の人と同じ嗜好であるとは思いませんが「自分の良いと思うもの」を紹介させて頂きたいという考えを貫き、男鹿なびスタッフ目線で色々な男鹿の情報を発信しています。 (株)男鹿なび会社概要 社名株式会社男鹿なび ※2015年8月 有限会社ピー・エイチから商号変更 代表者代表取締役 船木 一 所在地〒010-0511 秋田県男鹿市船川港
Googleマップをイラストマップみたいにしたい。
サイト制作において、アクセスマップなどの地図の表示はどうしてますか？「Google Maps API」を利用したり、ちょっとデザインにこだわりたい時にはイラストに描き起こしたりしてるんじゃないでしょうか。 今回は、Google マップをちょいとカスタマイズすれば、まるでイラストマップみたいに見せることができるんだぜ！というお話です。 記事中に出てくる画像は2012.3現在のもののため、現在のGoogle Maps APIでの表示とは異なりますので注意です…X(。 リンク切れしていたところを、なるべく近い内容の存在するページにリンクし直しました（2015.7.20追記）。 まずはしっかり抑えておきたい「Google Maps APIの基本」から。 基本をすっ飛ばして早速カスタマイズしたい方はこちら↓。 Google Maps APIの基本 Google マップはGoogle API キーを発
APIと少しのjQueryコードでGoogle Mapの地図の色を変更する
Google MapのデザインをjQueryで変更する為のメモ書き。Google Map APIとjQueryでGoogle Mapの色合いを変更し、オリジナルのマーカーを付けてみます。こうする事で、既存デザインに合わせたGoogle Mapが出来ます。 今後必要になりそうだったので調べ物をしたついでにメモ書きです。デザインを変更、というと語弊がありますけど、好みの色に変えてみます。 ゴール↓ こんな感じのをjQueryでやろう、みたいな内容です。特に目新しい情報では無いですが。 なんかシャドウ変になっちゃった・・色やマーカーだけでもWebサイトで使用している色にあわせれば地図だけ浮いてしまうような事も無くなるんじゃないかなと思います。 ジオコーディングリクエスト<script type='text/javascript' src='http://ajax.googleapis.com/a
Google Mapに表示されるマーカーのふきだしを消す方法
※Googleのapi変更により現在この記事の方法は使えなくなっているようです。 Google Mapは特定の位置をポイントしてウェブサイト上に地図を表示するのにとても重宝しますが必ずふきだしがついてしまいます。 通常はふきだしがあっても全く問題ないのですが、単に地図上の一点を示したい時や小さな地図には邪魔になるときがあります。ふきだしを何とか消せないもんでしょうか。 Google Mapのふきだしの消し方Google Mapのリンクスクリプトの中にパラメーターを書き加えることで吹き出しが表示されなくなります。具体的にはリンクスクリプトの中の output=embed という部分に &iwloc=B を書き加えてください。 output=embed&iwloc=B 書き加えると該当スクリプト部分が上記のようになります。 通常のGoogle Mapのリンク 大きな地図で見る ふきだしを消すた
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
