Last active
September 8, 2017 10:20
-
-
Save amay077/7317192 to your computer and use it in GitHub Desktop.
地理院地図の標高タイル(CSV)を描画してみた ref: http://qiita.com/amay077/items/ef41e8feef3bafd15453
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| map.mapTypes.set("GsiMaps", { | |
| name:"標高タイル", | |
| tileSize:new google.maps.Size(256,256), | |
| minZoom:14, // 標高タイルは Lv:14 しか用意されてないので | |
| maxZoom:14, | |
| getTile:function(tileCoord, zoom, ownerDocument) { | |
| // 普通は img だけど、標高タイルは CSV で画素毎の標高値が取得できるので、 | |
| // クライアント側で描画するために Canvas を使う | |
| var canvas = ownerDocument.createElement("canvas"); | |
| canvas.width = 256; | |
| canvas.height = 256; | |
| var x = (tileCoord.x % Math.pow(2, zoom)).toString(); | |
| var y = tileCoord.y.toString(); | |
| // 各画素の標高値を取得する | |
| canvas.tileUrl = "http://cyberjapandata.gsi.go.jp/xyz/dem/" + zoom + "/" + x + "/" + y + ".txt"; | |
| // 標高を描画する | |
| renderDem(canvas); | |
| renderedTiles[canvas.tileUrl] = canvas; // タイル再描画の為にとっておく | |
| return canvas; | |
| } | |
| }); | |
| // 標高タイルを描画する | |
| function renderDem(canvas) { | |
| var ctx = canvas.getContext('2d'); | |
| ctx.clearRect(0, 0, 256, 256); | |
| $.get(canvas.tileUrl, function(data) { | |
| // CSV が得られるのでパース | |
| var lines = data.split(/\r\n|\r|\n/); | |
| for (var i = 0; i < lines.length; i+=dotSize) { | |
| var cols = lines[i].split(','); | |
| for (var j = 0; j < cols.length; j+=dotSize) { | |
| if (cols[j] == 'e') { // エラーの画素には 'e' が入ってる | |
| continue; | |
| } | |
| // 標高0m を startColor、標高1000mを endColor としたグラデーション色を設定する。 | |
| ctx.fillStyle = $.xcolor | |
| .gradientlevel(startColor, endColor, cols[j] / 1000.0 * 100.0, 100) | |
| .getCSS(); | |
| ctx.fillRect(j, i, dotSize, dotSize); | |
| } | |
| } | |
| }); | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment