• お気軽にお電話下さいTEL:0116686551
  • メールでのお問い合わせはこちら、お問い合わせフォーム

社長

スタッフブログ

Google Maps APIのPolygonで50mメッシュ [ 2013年02月07日 ]

ウェブサイトの制作で「Google Map」を使うときは、会社などの所在地を表す地図として使うことが多いのですが、時にお客様から地図情報を使ったコンテンツ制作の依頼があります。

ある地域上の一定面積を矩形で表したメッシュ画像があるが、メッシュ画像だけでは矩形の場所が地域のどこなのか分からない、そこでメッシュを地図の上に重ねて表示できるかどうか。

透過のPNG画像を重ねて表示することを提案しがた、地図の緯度経度にあった画像の生成が難しいので緯度経度の座標からメッシュの矩形を生成して表示できないかとの返事。

Google Map 上に線や矩形を描画したサンプルを見たことがある。

Google Developers のサイトを見れば画像を重ねたり、線や多角形などを描画するサンプルが掲載されています。

そんなサンプルを元に会社の位置を中心に50mmメッシュを作ってみました。

mesh.jpg矩形の塗りつぶしには、透明度の指定もできるので透かして地図のどこに矩形があるか分かるようになります。

この様な制作作業があったり、緯度経度を取得する地図や「Google Earth」を使い宇宙からの視点をスタートして、地球上の特定の地点を表示したりするページも作りました。
会社の所在地を表すだけではなく、ちょっと違った使いかたのコンテンツを作ることは制作の刺激になります。