◆ Google Maps API v3 / マーカーアニメーション Class
日本語のブラウザでアニメーションクラスを検索し、日本語版リファレンスへ飛んでも記載なし。英語版で確認してください。
現在、サポートされているmarkerのAnimations classは、”DROP”と”BOUNCE”
* DROPは、マーカー表示の際に上から落ちてくるアニメーション。
* BOUNCEは、クリックイベントで飛び跳ねるアニメーションが可能。
面白いので、実装してみては？
スポンサードリンク
Category Archives: Google Maps API v3
マーカーアニメーションクラス アイコンが降ってきたり、飛び跳ねたり！
Posted by 管理人 on 2010年12月23日
None comments | 3,940 views
マーカーの設定 new google.maps.Marker()
Posted by 管理人 on 2010年12月23日
None comments | 2,833 views
var marker;
var myLatlng = new google.maps.LatLng(-25.363882,131.044922);
marker = new google.maps.Marker( { position: myLatlng, title:”Hello World!” });
marker = new google.maps.Marker( { map: map, //・・・・・・マーカを表示させる地図の指定
position: initialLocation, //・・・・・・マーカの座標・位置を指定
icon: ’http://waox.main.jp/maps/icon/car2.png’, //・・・・・・アイコンの画像を指定
shadow: shadow, //・・・・・・アイコンの影画像を指定
flat: false, //・・・・・・true の場合、マーカーの影は表示しない
title: ‘現在位置’, //・・・・・・タイトルの表示文字
draggable: false //・・・・・・マーカー（アイコン）移動の有効無効
clickable: true, //・・・・・・クリック有効無効
visible: true,//true の場合、マーカーを表示する。
animation: google.maps.Animation.DROP,//・・・・・・マーカー（アイコン）のアニメーション
iPhone（アイフォン）向け地図にもAndroid コントローラの拡大縮小のズーム コントロールを表示させる。
Posted by 管理人 on 2010年12月19日
None comments | 2,617 views
◆ Google Maps API v3 / php+MySQL サンプルStore Locatorを試してみる。
iPhone（アイフォン）の地図のコントロールナビゲーションUIには、google codeを見るとiPhone（アイフォン）用のデフォルトは無し。
しかし、iPhone（アイフォン）でも、ナビゲーションのオプション設定すればOK。お試しあれ。
Read more »
トータルの合計距離+地図から行きたい場所を探して、出発、中継点、到着点を入力クリックしてドライブルート経路検索
Posted by 管理人 on 2010年12月5日
None comments | 3,351 views
◆Google Maps API V3 + Directions API （トータルの合計距離を表示させたい）
デモギャラリーサンプルをいじってみたが、何か足りん。
そう、地図右側に表示されるルート表示のサイドバーでは、トータルの距離がわからないのである。ぐっ不便。
しかしながら、デモギャラリーでなく、Google Maps Javascript API V3 Examplesのサンプルを見ていたらtotal distanceを表示したサンプルが・・・。
せっかくなので、MarkerClustererと組み合わせて、MarkerClustererで表示されたアイコン間をドライブした気分でルート検索した合計距離を表示させてみる。
マップ（地図）をクリックしてルート経路検索／Google Maps Directions API V3
Posted by 管理人 on 2010年12月5日
None comments | 6,425 views
◆Google Maps API V3 + Directions API （マップ（地図）をクリックしてルート経路検索）
v2と何が違うかは、さておきGoogle Maps JavaScript API V3 デモ ギャラリーから自分のｻｲﾄで使えそうなサンプルを試してみる。
コレがのちのちiPhone（アイフォン）用でも使えそう。
このデモギャラリーサンプル、機能が足りないところがあるので追加。
- Get directions！で表示せた緑色のマーカー（アイコン）も移動できないので、同様に「draggable: true」を追加。
- 日本で対応していない var mode の “case “bicycling”: mode = google.maps.DirectionsTravelMode.DRIVING;break;”をscriptから削除。
- HTMLの<option value=”bicycling”>は削除
- HTMLの input タグで、highway tolls のcheckedはデフォルトに不要なので削除
- <input type=”checkbox” id=”highways” checked=”checked” />・・・・・一般道優先（チェックすると高速を使わない）
- <input type=”checkbox” id=”tolls” checked=”checked”/>・・・・・チェックすると有料道路を使わない（※試してみたら有料の橋やバイパス道路を避けた。highwaysとは別）
- 英語コメントを日本語に書き換えて終わり。
bodyタグでのonloadイベントを外部Scriptファイルに記述する方法
Posted by 管理人 on 2010年12月5日
None comments | 12,878 views
ユーザの現在座標位置を収得する方法とは？／Geolocation + iPhone（アイフォン）+Google Maps API v3
Posted by 管理人 on 2010年11月6日
None comments | 13,842 views
◆Google Maps JavaScript API V3 + Geolocation （現在位置の座標情報を取得する）
iPhone（アイフォン）で地図が見れるようになりましたので、出かけたときに自分の位置をGPS情報から収得したいでうすよね。さて、どうすればいい？ いつものように、Google Maps JavaScript API V3のトップページからスタート。Google Maps JavaScript API V3 – 基本ページに、ユーザーの現在地の検出（Geolocation）について説明があり、下記のような内容。
- iPhone（アイフォン）で位置情報を収得するのは、Google Maps API では無い。
- iPhone（アイフォン）のブラウザsafariがサポートしている”W3C Geolocation 規格”の”Geolocation” を用いる。
- ”W3C Geolocation 規格”で位置を収得できない場合、Google Gears Geolocationを使う方法がある。
このページにあるサンプルコードをみると
// Try W3C Geolocation (Preferred) if(navigator.geolocation) { browserSupportFlag = true; navigator.geolocation.getCurrentPosition(function(position) { initialLocation = new google.maps.LatLng(position.coords.latitude,position.coords.longitude); map.setCenter(initialLocation); }, function() { handleNoGeolocation(browserSupportFlag); });
Apple iPhone（アイフォン）で正確な地理的座標位置を取得するメソッドの比較。／Googel Maps API v3 Geolocation
Posted by 管理人 on 2010年11月6日
1 comments | 5,154 views
◆ navigator.geolocation.getCurrentPosition() と navigator.geolocation.watchPosition()メソッド
iPhone（アイフォン）の座標収得で使用するnavigator.geolocation.getCurrentPosition()、と navigator.geolocation.watchPosition()メソッドの大きな違いは、都度、現在位置をユーザが読み込んで位置情報を収得するのか、それとも連続的に収得するだけだと思っていたが、正確な座標制度を得るには、navigator.geolocation.watchPosition()を使った方が良いとの記事を見つけた。 ＜記事URL＞ Read more »
スポンサードリンク
