infobox.jsを使って、画像なしで連番のオリジナルマーカーを作ってみよう！ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
準備するもの Googlemapのinfowindowをカスタマイズする「infobox.js」 基本的な使い方については、以前別の記事で書いているので参考にしてください。 本稿のinfobox.jsの使い方は、吹き出しだけでなく、マーカーもオリジナルのDOMで作って、テキストも自由に置けるようにしてしまおうというものです。 機能を洗い出してみよう！ まずテキストで必要な機能をざっくり並べてみましょう。 googlemapのインスタンスを作成 infoboxを作成 ショップ情報を配列で用意 配列をfor文で回す マーカーのDOMを作成 吹き出しのDOMを作成 マーカーを全て表示する マーカーにクリックイベントを紐づける 全infoboxを非表示にする関数を用意 あとはこれにそってコードをガンガン描いていくだけです！ HTML、CSS、JSコーディング ではコーディングしていきましょう。 H
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の右クリックメニューその２
前回の記事（Google Maps APIで右クリックメニューを作成）では単純に右クリックを表示して、ズームレベルを設定するだけだったが、それを本家のGoogleマップっぽくカスタマイズしてみた。 →サンプル 「ここを地図の中心」機能を追加するためには、クリック位置を動的にメニュー内に返さないといけないので、rmenu.innerHTML = "～"をイベントハンドラー内へ移動。 単純な流れは GEvent.addListener(map, "singlerightclick", function(point) {～}のpointがクリック地点（ピクセル：X座標、Y座標）。 それを緯度・経度に変換して変数に格納。 <a href="javascript：map.panTo(変数)>ここを地図の中心</a> クリック地点の変数をグローバルで宣言して、function map_center()
Google Maps APIで日本の住所から緯度・経度を求める方法 - F.Ko-Jiの「一秒後は未来」
[追記: 2006/12/08] 日本でも Google Maps API でのジオコーディングが正式にサポートされました。下記は Google AJAX Search API を利用したジオコーディングの方法です。 Google Maps API のクラスを使う方法は「Google Maps APIで地名から緯度・経度が取得可能に」をご覧ください。 以前のエントリーでも触れていますが、ちゃんと書いておこうかと思います。Google Maps API標準のジオコーディングクラスが日本に対応するまでの応急措置です。 ジオコーディングにはGoogle AJAX Search APIのローカル検索を利用します。 1. http://code.google.com/apis/ajaxsearch/のページにある「Sign up for a Google AJAX Search API key」をク
Google Map マーカーのドラッグドロップで緯度・経度を取得 - 備忘帳 - オレンジ工房
Google Mapを使うとき、特定の場所の緯度・経度を取得したいことが多々あります。 公式ドキュメントにあるように、住所をクエリー送信して取得すればよいのですが、微妙に位置がズレてるときってないですか？ 緯度・経度の数値をチビチビと調整するのは、あまりにも面倒なので。 地図上のマーカーをドラッグ＆ドロップできるようにして、その位置の緯度・経度を表示するスクリプトです。 (2012/10/23追記)以下はver.2時代の例です。これではなく、新しいAPIを使うことをお勧めします。このページのデータは、とりあえず放置中です…。 (2013/02/04追記)ずっと放置もアレなので、新しいGoogle Map API(ver.3)対応のサンプルを公開しました。ver.2は正式に廃止予定なので、古いコードは早めに書き換えましょう。 (2014/05/24追記) サポート終了についてはこちら：htt
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
素早く簡単にGoogleマップを導入できるjQueryプラグイン「initmap.js」:phpspot開発日誌
index.html
