サクサク読めて、アプリ限定の機能も多数！
トップへ戻る
大阪万博
rnk.mitelog.jp
Javascriptで変数を判定する場合に、判定条件が2個以上あるときに論理演算を使います。 例として以下の様な感じでしょうか。 var x,y; // いろいろな処理・・・ if ((x > 10) && (y > 20)) { // xが10より大きく、かつ、yが20より大きい場合の処理 } if ((x > 10) || (y > 20)) { // xが10より大きいか、または、yが20より大きい場合の処理 } 最初のif文は(x > 10)の論理式と(y > 20)の論理式をAND演算で結合し判定しています。 また、次のif文はそれぞれの論理式をOR演算で結合しています。 これらを以下の様にしてみると、新しい変数h1、h2にはそれぞれ論理演算の結果であるtrueもしくはfalseの値が設定されます。 var x, y; var h1, h2; h1 = (x > 10) && (
■ジオコーディングより住所文字列から緯度・経度を取得 ジオコーディングを使って、文字列の住所から緯度・経度を取得し、その位置にマーカーを表示します。 ジオコーディングのインスタンスをマップの生成と共に、初期処理にて生成しておきます。 [Geocode]ボタンをクリックされた時に、ジオコーディングの geocode メソッドを利用してジオコーディングのリクエストを行います。 ジオコーディング化の結果はgeocode メソッドで宣言された、コールバック関数に帰ってきます。 コールバック関数は results, status の引数を持ち、statusがOKでなければエラーが発生しています。 statusがOKの場合、resultsはGeocoderResultオブジェクトの配列として返されてきます。 返された配列の0番目の値にジオコーディング結果が入っています。 results[0]のプロパテ
■マップ上にポリライン・ポリゴンを表示 マップ上にポリライン（折れ線）及び、ポリゴン（多角形）を表示します。 ポリラインを表示するにはPolylineクラスを生成し、それをマップ上に設定します。 また、ポリゴンを表示するにはPolygonクラスを生成し、それをマップ上に設定します。 以下の例は、5個の座標を用いてそれぞれ同じ形のポリライン、ポリゴンを表示します。 ポリゴンは内部を薄い色で塗りつぶしを行います。 <head> <title>Google Map API v3-7</title> <script type="text/javascript" src="http://maps.google.com/maps/api/js?key=(取得したkeyコード)" charset="utf-8"></script> <script type="text/javascript"> func
■Infowindowの大きさ設定 以前の記事の中でInfowindowを使って単なる文字列の表示を行ったことがありましたが、 このブログをご覧の方で、「リンクが貼れればいいのに」との感想がどこかにありました。 そこで、今回はそのリンクと併せて、Infowindowの大きさ設定のことについて記事を書きます。 Infowindowにはオプションとして指定できる大きさの引数としてはmaxWidthしかなく、 高さ指定がありません。 Infowindowに表示する内容としてのcontentに縦に長いものを渡すと 縦方向は適当に内部で処理してくれているようです。以下にその例を示します。 （尚、縦に長すぎてmapの縦に収まらない場合はスクロールバーが表示されます） <head> <title>Google Map API v3-11</title> <script type="text/javasc
■簡単なマーカーの表示 前回の地図の上に、簡単なマーカーを表示したいと思います。 <head> <title>Google Map API v3-3</title> <script type="text/javascript" src="http://maps.google.com/maps/api/js?key=(取得したkeyコード)" charset="utf-8"></script> <script type="text/javascript"> function initialize() { // Google Mapで利用する初期設定用の変数 var latlng = new google.maps.LatLng(36.062092, 136.223323); var mapOptions = { zoom: 14, mapTypeId: google.maps.MapType
「GoogleMap API」もバージョンが３．０になってからしばらく経ちますが、「GoogleMap API V3」を使う機会がありましたので 「GoogleMap API V3」について数回に分けてチュートリアルを載せていきます。 今回は最初として、簡単な地図のみを表示することを行います。（JR福井駅を中心とした地図） <head> <script type="text/javascript" src="http://maps.google.com/maps/api/js?key=(取得したkeyコード)" charset="utf-8"></script> <script type="text/javascript"> function initialize() { // Google Mapで利用する初期設定用の変数 var latlng = new google.maps.Lat
■ルート検索の結果をルートレンダラで表示 「その９」の例では、ポリラインを使ってルート検索結果を描画しましたが、 ルートレンダラを使えばそんな面倒なことはしなくても簡単に描画することができます。 ルートとルートレンダラのインスタンスをマップの生成と共に、初期処理にて生成しておきます。 [検索]ボタンをクリックされた時に、ルートの route メソッドを利用してルートのリクエストを行います。 ルート検索の結果はroute メソッドで宣言された、コールバック関数に帰ってきます。 コールバック関数は results, status の引数を持ち、statusがOKでなければエラーが発生しています。 statusがOKの場合、ルートレンダラのsetDirectionsメソッドにresultsを渡すことで、ルートが描画されます。 results[0]のプロパティとしてoverview_pathがあり
■マップのイベントとマーカーのイベントの複合的な使い方 マップ上でクリックした位置にマーカーを表示し、さらにそのマーカーをクリックした時に マーカーの緯度経度の値を情報ウインドウに表示します。 この例は、Googleのサンプルとして乗っているものを変更したものです。 マップ上でのクリックイベント時の関数を設定し、その中でマーカーを生成し、さらに情報ウインドウの表示を 行うように、マーカーのクリックイベント時の関数を設定しています。 また、マーカーを生成した時に、そのマーカーをグローバル変数の配列に保存し、その配列のマーカーを 使って、再表示、クリア、削除処理を行っています。 <head> <title>Google Map API v3-6</title> <script type="text/javascript" src="http://maps.google.com/maps/api
■マーカーのイベントで情報ウインドウを表示 マップ上にマーカーを表示し、そのマーカーをクリックした時に情報ウインドウを表示します。 以下の例は、マーカーのクリックイベントの関数を登録する前で、情報ウインドウを生成しておき、 クリックイベントの関数の中でその情報ウインドウを表示する様にしています。 <head> <title>Google Map API v3-5</title> <script type="text/javascript" src="http://maps.google.com/maps/api/js?key=(取得したkeyコード)" charset="utf-8"></script> <script type="text/javascript"> function initialize() { // Google Mapで利用する初期設定用の変数 var latlng
このページを最初にブックマークしてみませんか？
『rnk.mitelog.jp』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
