Arsip Tag: JavaScript

OVRDC Vehicle Crash Explorer

Sila lihat peta kejadian kecelakaan dibuat menggunakan Mapbox GL JS. Gunakan klik kanan untuk memutar peta nya.

https://www.ovrdc.org/apps/accident-explorer.html

 

Iklan

Leaflet MBTiles

Iván Sánchez Ortega menulis plugin yang keren agar Leaflet dapat menggunakan MBTiles layer. MBTiles adalah sebuah SQLite yang berisi gambar masing-masing ubin. Kekurangannya adalah ukurannya yang besar. Saya coba untuk Pekanbaru lv 1-19 sekitar 1.4 Giga. Source-code dari repo Ivan juga seolah olah besar karena ada berkas .mbtiles demonya yang berukuran 9.4MB.

Sayangnya, sepertinya karena ukuran mbtiles yang besar, tidak mampu diload oleh Firefox saya, berikut pesan kesalahannya.

2017-12-11_17-11-58.jpg

 

https://gitlab.com/IvanSanchez/Leaflet.TileLayer.MBTiles

Create MapServer Tile Image for Google Map API v3

Ever since google updated their Google Map API into version 3 (probably around 2010), output generation sample code in page 463 on MapServer Documentation, Release 6.4.1 were not working anymore, and it had been frustrated me. I love that image tiling approach which will save tons of bandwidth and processing time for my MapServer.

Tonight, I manage to playing around and looking for sample code that google provided here.

If  you’re willing to put your MapServer tiled images (instead of custom divs provided in that sample), the only thing that you need to do is to change this function:

CoordMapType.prototype.getTile = function(coord, zoom, ownerDocument) {

comment or delete everything there (within that function), and change it with your own image provided by your MapServer tiled image:

var url = “http://localhost:81/cgi-bin/mapserv.exe?”;
url += “map=/ms4w/apps/belajar/kampar04/kampar.map&”;
url += “mode=tile&”;
url += “layers=jalan&”;
//url += “layers=layer1 layer2&”;
url += “tilemode=gmap&”;
url += “tile=” + coord.x + ” ” + coord.y + ” “+zoom;

var myMapServerTile = ownerDocument.createElement(‘img’);
myMapServerTile.src= url;
return myMapServerTile;

VOILA … it’s now fully working …

p.s: change http://localhost:81 and the rest of URL into your MapServer’s map file.

basic map types