Let's make something

PHPやJavaScriptを学びながら、サイトを作ってみようと思う今日この頃

JavaScript

GoogleMap API V3で地点一覧のリストをクリックすると地図上でマーカーの吹き出しを表示する

今回は、動的に地点データを読み込みんでマーカーを表示し、地図とは別に地点データをリストを表示します。 リスト表示した地点データのリンクをクリックすると、地図上で吹き出しを表示します。基本は、前回と同じです。変更点は、動的に読み込んだ地点デー…

GoogleMap API V3でマーカーの地点データを動的に読み込む

今回は、HTML内に持っていた地点データをJSONファイルに分離して、AJAXを使用してJSONファイルを読み込んでマーカーを設定します。 今回のサンプルでは、jQueryを使います。処理イメージとしては、以下の感じです。 HTML読み込み 地図生成 地点データ読み込…

GoogleMap API V3で番号付きマーカーを動的に生成

今回は、GoogleMap API V3で番号つきマーカーを動的に生成して表示するサンプルです。マーカーのピンの生成は、Google Chart APIを使います。作成方法は簡単で、Google Chart APIは、番号つきのピンと影を生成できて、Google Map APIはマーカーのピンと影を…

JavaScriptの論理演算子は、true/falseを返却しない

ソースコードを色々見ていると、下のようなコードが出てきた。なぜこれで初期化ができるのかわからなかったので調べると、JavaScriptの論理演算子(&&、||)はtrue/falseを返さないとのこと。ほとんどのJavaScript入門サイトでは、論理演算子(&&、||)はtrue/fa…

GoogleMap API V3で複数のマーカーを表示吹き出しは1つだけにする

お店を紹介するサイトを作ろうということで、複数のお店の位置情報を1つのマップで表示するために、 GoogleMapで複数のマーカーを1つの地図に表示する方法を調べました。また、マーカーをクリックすると吹き出しが表示されますが、複数の吹き出しを表示せず…