勉強したことのメモ

webプログラマ見習いが勉強したことのメモ。

GoogleMapでマーカーをまとめる

   

GoogleMapAPIでマーカーを複数表示し、近隣のエリアごとにまとめて表示させたかった。調べたところGoogle公式でAPIが用意されていた。以下に作成方法のメモ。

 

サンプル

http://sample.taitan916.info/clusterer/

 

事前準備

マーカーの表示と自動ズームが入ったマップの作成に関しては以前の記事のものを使用した。

https://taitan916.info/blog/?p=2403

 

ライブラリの読み込み

以下でライブラリを読み込んでおく。

 

JavaScript部分

コメントを入れてある部分が以前の記事のソースとは異なる部分になる。

 

リファレンス

https://developers.google.com/maps/documentation/javascript/marker-clustering?hl=ja

 - JavaScript

  関連記事

javascriptでスクロール

やりたかった事は、 ・javascript,jQuery使う ・スクロールさせた ...

JavaScriptでinputタグのtypeを変更

チェックボックスの状態によって inputタグのtypeをtext⇔passwo ...

Android2.3でJavaScriptのエラー

Android2.3で関数が動かないといったエラーが発生していた。 担当外だった ...

IE&javascriptの予約語

前にもひっかかった問題で、今日同じことで 時間をとられたのでメモ。 予約語? っ ...

JavaScriptで文字列から数値へ変換時の注意

JavaScriptで文字列から数値へ変換時に思った挙動と異なることがあった。具 ...

javascriptで論理和演算子の特殊な使い方

論理和「||」の特殊な使い方を教わったのでメモ。 普段使うのは、 if (a = ...

IEでjavascript関数の初期値

あるJavaScriptの関数でchromeやfirefoxは正常に動いたけどI ...

クロスドメイン突破をjavascriptで行う

ajaxとかでクロスドメインを突破する際は、 PHPファイルを介すかJSONPを ...

JavaScriptでAjaxを使わずにクロスドメインから変数を取得する

JavaScriptの配列形式で出力するファイルを作成しておき、 動的にソースに ...

javascriptで実行時間の測定

var time_test = function(){ var x = 1; f ...