Googleマップ上に複数マーカー・吹き出しを表示する
Google Maps上に複数のマーカーとクリックすると吹き出しを表示するサンプルを作成しました。CakePHP経由でDBからデータを取得し表示しています。 デモはこちら スクリプト <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 実装 <div id="div798"></div> <script type="text/javascript"> $(document).ready(function(){ // マップ作成 // マップ中心座標設定 var latlng = new google.maps.LatLng( -34.580083, -58.381577); // オプション var myOptions = { zoom: 4, // マ
Google Mapデモ
◆Google Maps JavaScript API V3 Example（Demo）一覧 ※本ページのiPhone（スマートフォン端末）用デモを見るには、ブラウザはGoogle Cｈromeを使用して下さい。 はじめに ともかく地図を表示する。（デフォルト：ナビ、地図タイプ、距離スケール表示） WordPressの記事内にGoogle Mapを表示させる アイコンとインフォウィンドウ アイコン（マーカー）+インフォウィンドウ コントロール アンドロイド”Android” コントロール（地図の拡大・縮小） 拡大・縮小用ズームコントロールボタン（地図の拡大・縮小） カスタムコントロール/地図内に現在地に戻るボタンを設置 全画面フルスクリーン表示を切り替えるボタンをGoogleマップ内に実装する マーカー（アイコン）の配列についての検証(２次元配列を理解してみる) for (var i =
Google Maps API V3の使い方とは？ | WordPressにGoogle Maps API V3！
◆Google Maps JavaScript API V3 ブログ目次 Google Maps API v3とは？ 本ブログは判らないところをコツコツ積み重ねました。あくまでご参考にされて下さい。Google Maps APIを扱うことは決して難しいことではないと思います。Google Maps JavaScript API V3のページからスタートするといいと思います。 ※V2は、2013年11月以降は使用できなくなります。 いきなりサンプル集（example）地図を見るならコチラ Google Maps API Google Maps APIサービスがサポートする国・都市の一覧表 初期設定 Google Maps API V3の地図（マップ）をPC、スマートフォンで見れるように表示させるscriptとメタタグの設定 地図に表示する。 ナビゲーションコントロール、マップタイプコントロー
Google Maps APIの読み込みをカテゴリーごとにCSSでタブ風に切り替える方法
当サイトではアフィリエイト広告を利用しています。 ランチブログなどでトップページにGoogle Mapを用意してマッピングするようなサイトを運営している場合、カテゴリー（ラーメン、カレー、とんかつなど）ごとにタブで切り替えたいというニーズはあると思います。 こが簡単なようで何気に難しいかったので、自分が実際にできた方法をご紹介したいと思います。 ちなみにタブ切り替えはjQueryを使うことが多いのですが、Google Maps APIとの相性が悪かったためCSSでの実装にしています。 実はこの内容は自分が別で運営している「WordPressとプラグインを使ってお店紹介サイトを作る方法」に問い合わせで来たもので、Google Maps APIの基本的なところはこちらの記事を参考にしてもらえるといいかなと（重要なところは書きますが…） →Google Maps API | WordPressと
Google Maps APIを使って見た: 駄文と書評
こんにちは。松旭斎すみえです（嘘です） Google Maps のAPIが公開されたのでいろいろなサイトを参考にりょーちも勝手に作ってみた。(Google Maps API Documentationを参照) いろいろ見たけど、「一番上手いこと作ってるなー」と思ったサイトが下記のサイト。 見ていて非常に楽しい使い方だなーと感心するばかりであった。（こういう使い方だよなー。ホント） 更にソースコードも非常に分かりやすい。素晴らしいっす。 で、りょーちもこのサイトを参考に（というか97%くらいパクって）Google Maps APIのテストスクリプトを書いてみた。 【遊び方】 ・Google Maps が表示されると、縮尺など変更したりしてみたりして、どこか適当なところに行きます。 ・現在の座標と縮尺サイズが右側のテキストボックスに表示されるので、適当な地名と説明を入力します。 ・「登録」ボタ
Google MAPS JavaScript APIの単純な例:Geekなぺーじ
ここでは、Google MAPS JavaScript APIを使った単純な例を説明したいと思います。 サンプル 以下のサンプルはGoogle MAPS JavaScript APIを使ったページのソースです。 地図の表示だけを行うという単純なものです。 <!DOCTYPE html> <html> <head> <style type="text/css"> html { height: 100% } body { height: 100%; margin: 0px; padding: 0px } #map { height: 100% } </style> <script src="http://maps.google.com/maps/api/js?v=3&sensor=false" type="text/javascript" charset="UTF-8"></script> <
マーカーの作成 - マーカー - Google Maps JavaScript API入門
地図上に目印をつける目的で使用されるのがマーカーです。実際は次のような形で地図上で表示されます。 ではまずマーカーを表すMarkerクラスのオブジェクトを作成します。コンストラクタ関数は次のように定義されています。 Marker(opts?:MarkerOptions) 指定されたオプションを使用してマーカーを作成します。地図が指定されている場合、構 築するときに地図にマーカーが追加されます。マーカーを表示するためには位置を設定し ておく必要があることに注意してください。 オプションである1番目の引数にはマーカーを表示する対象となる地図や座標などを設定するために使用するMarkerOptionsオブジェクトを指定します。引数を省略した場合は用意されているメソッドなどを使って設定して下さい。 マーカーの場合、MarkerOptionsオブジェクトの「map」プロパティに値を指定してMarke
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
06.GRASSHOPPER