Google Maps のメッシュレイヤ作成補助サービス

ひとことお願いします

Webサービスは，サービス単体ではほとんど使い物にはなりません．みなさまが開発されるアプリケーションの一部機能について，インターネットを介してお手伝いするものです．

概要

任意サイズのメッシュについて任意の色で塗りつぶしたレイヤーを Google Maps に重ね合わせるための画像作成サービスです。

地域メッシュ(JIS X 0410) をサポートするモードもあります。

URLは http://www.findso.jp/ws/gmmesh.php です。

このサンプルスクリプトは、スクリプト例に用意しています。

パラメータ

GETメソッドのみ有効です。共通パラメータと、一般モードパラメータか地域メッシュモードパラメータを設定して下さい。

共通パラメータ

tx, ty: getTileUrl() で得られる position の値のx, y プロパティ。
zoom: getTileUrl() で得られる zoom の値。
cx, cy: 東西及び南北のセル数。
bg: 背景色。色コードは色コードについてを参照して下さい。
t: 背景透過スイッチ。't=t'とすれば背景色を透過色にし、それ以外は背景色を透過色にしません。
p: パレットリスト。色コードを ',' で区切った文字列とします。色コードは色コードについてを参照して下さい。
d: データをパレットインデックスとして、',' 区切りの1次元整数配列の文字列として表現します。列数、行数は cx, cy によって決定されます。パレットインデックスは1開始です。
bdw: グリッド境界線の幅。0以上の数を有効とします。bdw=0を明示することで、グリッド境界線の描画を止めることができます。デフォルトは1です。
bdc: グリッド境界線の色。bdwが0の場合は無効です。色コードは色コードについてを参照して下さい。デフォルトは黒(R,G,B)=(0,0,0)です。
img: 画像フォーマットを選択します。現在有効なのは 'gif', 'png' で、デフォルトでは 'gif' です。

一般モード

sx, sy: 東西及び南北の1つのセルあたりのスキップ数(秒単位)。配列についてを参照して下さい。
lat,lon: 起点となる緯度経度(秒単位)。配列についてを参照して下さい。

地域メッシュメッシュモード

地域メッシュモードは削除する可能性が高いので、ご注意下さい。

mc: 南西隅(起点ではありません)のメッシュを地域メッシュコードで示したものです。これを指定した場合、一般モードパラメータ(sx, sy, lat, lon) が上書きされます。
mo: データのオーダーを指定します。mo=s の時はスクリーンオーダー(北西から南東)、mo=m の時はマップオーダー(南西から北東)となります。mcが指定されていないと有効にはなりません。デフォルトはスクリーンオーダーです。

色コードについて

色コードは、赤、緑、青の順に 0-255 の範囲で指定し、それぞれの値は ':' でつなぎます。

たとえば、青なら255:0:0、オレンジなら255:128:0 などとなります。

配列について

データは、2次元を1次元にシリアル化したもので、東西方向順に配置されています(東西を列、南北を行とした場合には、FORTRANと同じ順になります)。

地図上で起点からどの方向に伸ばすかは、sx, sy が正か負かで決まります。つまり、sxが正なら東方向に、sxが負なら西方向に展開し、syが正なら北方向に、syが負なら南方向に展開します。

cx=3,cy=2で、d=1,2,3,4,5,6 となっているとき、sx,syの正負によって、次のように配置されます。

sxが正, syが正

4	5	6
1	2	3

sxが正, syが負

1	2	3
4	5	6

sxが負, syが正

6	5	4
3	2	1

sxが負, syが正

3	2	1
6	5	4

応答

応答は Content-Type を "image/gif" または "image/png" とした画像データです。

実行例

下の画像は露地野菜適作判定支援 Gooogle Maps 版の実行例です。地図と、栽培適地のメッシュとをあわせる、目星が付けやすくなります。また、空中写真とあわせることで、地理条件と適地判定結果との関連が見えやすくなります。

なお、本例の場合、平野部では赤くなっているので適地ではないのですが、山の方では緑になっているので、高いところで植えれば間に合うのではないか、といった判断ができます。

使用条件

このサービスを利用することによって生じた損害等の補償等は一切行いません。
このサービスは予告なく停止、廃止または移動する場合があります。
パレット数は16色+背景色1色、メッシュ数は 64*64 を制限としています。制限を越えた場合には正しい動作をしません。また、この制限は今後予告なく変更される場合があります。
地域メッシュモードは削除する可能性が高いです。
このサービスを利用したコンテンツ、サービス等を提供される場合には、上記のことを利用者に通知して下さい。

スクリプト例

本ページ上部にあるような地図を出すサンプルを以下に示します。

なお、HTML文書では id が "map" であるエレメントのサイズを事前に決定しておいて下さい。

window.onload   = onLoad;
window.onunload = GUnload;

var map = null;
var tileoverlay = null;

function onLoad() {
  map = new GMap2( document.getElementById('map'));

  // マップの生成、中心点移動、ズーム設定
  map.enableDoubleClickZoom();
  map.enableContinuousZoom();
  map.addControl(new GLargeMapControl());
  map.addControl(new GMapTypeControl());
  map.setCenter(new GLatLng(36,138),12);
  // レイヤー作成
  var tilelayer = new GTileLayer(new GCopyrightCollection(), 0, 17 );
  // 透明度設定
  tilelayer.getOpacity = function() { return 0.6; };
  // Google Maps が、このレイヤー表示のために呼ばれる URL を設定
  tilelayer.getTileUrl = function(point,zoom) {
    var url =
      'http://www.finds.jp/ws/gmmesh.php?'
      +'lat=129600&lon=496800'
      +'&t=t&cx=5&cy=5&sx=45&sy=30'
      +'&p=0:0:255,255:0:0,255:128:0,255:255:0,160:255:0,0:224:0'
      +'&d=1,2,3,4,5,2,3,4,5,1,3,4,5,1,2,4,5,1,2,3,5,1,2,3,4'
      +'&tx='+point.x+'&ty='+point.y+'&z='+zoom;
    return url;
  };

  // オーバレイ作成
  tileoverlay = new GTileLayerOverlay(tilelayer);
  // オーバレイ追加
  map.addOverlay(tileoverlay);
}

履歴

2008年1月31日: bdw, bdc パラメータを追加しました。
2009年4月23日: 画像の切れ目で枠線が出たり直上のセルの塗りつぶし色が出たりする問題を確認し、これを解消しました。