Salah satu challenge dengan hadiah paling menggiurkan pada Dicoding adalah Here Map Creator API Challenge. Challenge ini menantang developer untuk membuat aplikasi yang memanfaatkan HERE Map Creator API (Community Vector Tiles API) dengan hadiah 5.000 point. Secara umum aplikasi yang dibuat harus memiliki  fungsionalitas sebagai berikut :

1. Aplikasi bisa menampilkan Peta dengan menggunakan  Here Map Creator API.
2. Aplikasi yang dibuat harus memiliki fungsionalitas bisa menambahkan Point of Interest (restoran, rumah sakit, dll)
3. Aplikasi juga bisa menambahkan track untuk jalaur pendakian gunung, pejalan kaki, dll
4. Aplikasi dapat menyimpan data Point of Interest dalam bentuk CSV, dan untuk track data dalam format GPX.

Untuk membantu menyelesaikan challenge ini kami membuat project library dan contoh penggunaanya. Library ini dapat digunakan pada project Windows Phone. Anda dapat mengunduh library dan contoh penggunaannya disini.

Library ini memiliki fungsi sebagai berikut :

1. Menampilkan Peta menggunakan  Here Map Creator API
2. Mengubah koordinat pixel pada layar menjadi longitude dan latitude
3. Mengubah beberapa waypoint (titik pada peta) menjadi track
4. Mengconvert track menjadi GPX

Library ini memiliki beberapa kelas sebagai berikut :

TileMapHelper.cs

Ini adalah kelas utama pada library yang digunakan untuk menampilkan peta, mengubah koordinat pixel menjadi longitude dan latitude, dll. Jangan lupa menambahkan endpoint, API Key, dan App ID yang diberikan oleh IDECP Team Here di sini.

ConvertGPX.cs

Kelas ConvertGPX adalah kelas helper untuk membantu mengubah track, waypoint dan route menjadi file GPX. Kelas ini adalah hasil modifikasi dari kelas yang sama yang tersedia di http://ogl-lib.sourceforge.net/ .

Ada beberapa perubahan yang saya lakukan dari kelas originalnya. Yang pertama saya merubah beberapa method dalam menuliskan XML (karena pada yang original menimbulkan exception di project Windows Phone), dan saya tambahkan juga support untuk data track.

TileSystem.CS

TileSystem adalah helper class untuk bekerja dengan peta dengan system tile. Kelas ini, dan dokumentasi tentang bagaimana cara kerja peta dengan sistem tile dapat dilihat pada alamat berikut. Saya merekomendasikan anda untuk membaca dokumentasi ini.

CRoute.cs

Adalah kelas data yang merepresentasikan rute.

CTrack.cs

Adalah kelas data yang merepresentasikan track. Pada challenge Here Map Creator API Challenge kita menggunakan track (bukan route) untuk merepresentasikan jalur evakuasi, rute berspeda, dll.

CWayPoint.cs

Adalah kelas data yang merepresentasikan WayPoint. Kita bisa menggunakan waypoint untuk merepresentasikan titik pada peta. Biasanya kita menggunakan waypoint untuk merepresentasikan point of interest pada peta, namun karena pada  Here Map Creator API Challenge kita menyimpan data POI dengan format CSV, maka kita tidak harus menggunakan kelas ini.

Cara Menggunakan Library

Untuk menggunakan library ini pertama-tama kita harus menginisiasi kelas TileMapHelper.

TileMapHelper  mapHelper = new TileMapHelper(APPCODE,APPID,levelOfDetail, position.Coordinate.Latitude, position.Coordinate.Longitude);

Ada tiga parameter pada konstruktor TileMapHelper.

• APPCODE dan APPID didapatkan dari Here. Jika anda belum memiliki APPCODE anda bisa request ke email idecpteam@here.com
• LevelOfDetail : Ini adalah zoom level dari rentang 1-20
• Latitude : Nilai dari latitude peta yang akan ditampikan
• Longitude : Nilai dari longitude dari peta yang akan ditampilkan

Memperoleh Gambar Peta
Pada Tile Map System, peta yang akan ditampilkan direpresentasikan sebagai gambar. Untuk memperoleh gambar peta dari koordinat yang anda masukkan di konstruktor anda bisa memanggil method GetImage(). Untuk menampilkan peta berdasarkan parameter longitude, latitude dan levelOfDetail, anda bisa menggunakan method GetImage(double latitude,double longitude, int levelOfDetail).

Mengubah Koordinat Pixel di Layar Menjadi Longitude dan Latitude
untuk menambahkan POI, user akan menekan lokasi pada peta di aplikasi, dan aplikasi akan mengubah koordinat pixel di layar menjadi latitude dan longitude. Untuk membantu mengubah koordinat pixel pada layar menjadi longitude dan latitude, anda dapat menggunakan method public void ConvertScreenPixelToLongLat(double pixX, double pixY,out double lat,out double longi). 

Berikut adalah contoh penggunaan method tersebut. Contoh ini dipanggil pada event MouseLeftButtonUp pada Canvas :


private void imgMap_MouseLeftButtonUp(object sender, System.Windows.Input.MouseButtonEventArgs e)
{
var element = (UIElement)sender;

var tapPosition = e.GetPosition((UIElement)sender);
double longi_input = 0;
double lat_input = 0;

mapHelper.ConvertScreenPixelToLongLat(tapPosition.X, tapPosition.Y, out lat_input, out longi_input);

}

Membuat Object Kelas Ctrack
untuk menambahkan track pada kelas helper, pertama-tama anda harus membuat object dari kelas CTrack. Kelas ini memiliki properti name yang diisi dengan nama track, properti desc yang diisi dengan deskripsi track dan properti Track yang berisi kumpulan waypoint. Berikut adalah contoh bagimana menambahkan waypoint ke dalam kelas CTrack.

public List<CTrack> Tracks = new List<CTrack>();

List<CWaypoint> points = new List<CWaypoint>();

points.Add(new CWaypoint() { name = “POI”, lat = “-7.663996434” , lon = “111.191621963”, ele = 1847.31});

points.Add(new CWaypoint() { name = “POI”, lat = “-7.662694389” , lon = “111.192086404”, ele = 200.4});

CTrack track = new CTrack() { name = “ini Track”, Track = points.ToArray() })

Mengubah WayPoint,Route dan Track menjadi format GPX
Untuk mengubah WayPoint, Route dan Track menjadi format GPX, anda bisa menggunakan method GetGPX(). Pada contoh dibawah ini kita menginputkan track pada object dari kelas TileMapHelper dan menampilkan GPX pada layar output.

mapHelper = new TileMapHelper(APPKODE,APPID,levelOfDetail, position.Coordinate.Latitude, position.Coordinate.Longitude);


mapHelper.addTracks(new CTrack() { name = “ini Track”, Track = points.ToArray() });
Debug.WriteLine(mapHelper.GetGPX());

Penutup
Dengan adanya library ini diharapkan developer lebih mudah dalam menyelesaikan Here Map Creator API Challenge. Jika anda mengalami kesulitan, silahkan hubungi saya di adib<at>dicoding<dot>com

Download Projectnya disini.

Salam,

Adib

Also on Dicoding Blog

MacinCloud: Bikin Aplikasi iOS dengan Swift Tanpa MacBook

Capture The Flag: Cara Seru Belajar Cyber Security

8 Tipe Bug dan Error serta Cara Mengatasi dan Mencegahnya

Memahami Esensi Bahasa Pemrograman C++

Tutorial Belajar Python untuk Calon Machine Learning Developer

Tips Optimalkan Submission Dicoding