Menampilkan Virtual Earth di ASP.net

Windows Live merupakan kumpulan servis dan software dari Microsoft terutama untuk aplikasi web. Untuk menambahkan dan menggunakan Windows Live ke aplikasi ASP.NET bisa digunakan Windows Live™ Tools for Microsoft® Visual Studio® 2008. Salah satu kontrol yang tersedia di Windows Live tools adalah Virtual Earth tool. Kontrol ini memungkinkan programer ASP.NET menambahkan peta dari Virtual Earth tanpa menggunakan javascript sedikitpun. Dan peta yang dihasilkan tetap dapat berinteraksi di client berkat dukungan AJAX.

Artikel ini hanya membahas dasar-dasar penggunaan Windows Live™ kontrol versi November 2008 CTP untuk Virtual Earth yang dapat di download disini.

Setelah download, install file WindosLiveTools.msi . Setelah proses instalasi selesai, buka Microsoft Visual Studio.

Untuk menggunakan virtual earth tool, memerlukan .net framework versi terbaru (3,5)

add reference

Reference window

Pilih New Website.  Perhatikan toolbox panel, ada 2 tab baru ditambahkan Windows Live  dan Virtual Earth. Jika tab virtual earth tidak ada, tambahkan reference dan tab baru di toolbox panel. Browse ke folder Program Files/Windows Live tools tambahkan file Microsoft.Live.ServerControls.VE.dll ke folder bin.

Toolbox panel

Toolbox Panel

Setelah itu tambahkan di toolbox panel, akan ada tab baru.

Drag map ke page, secara otomatis di file aspx akan ditambahkan kode berikut:

<ve:Map ID="Map1" runat="server" Height="400px" Width="400px" />

dan window yang menunjukkan peta USA.
Buka code behind, tambahkan kode berikut di baris pertama

using Microsoft.Live.ServerControls.VE;

Sisipkan kode berikut di dalam event Page_Load

LatLong yx = new LatLong(-6.175428, 106.827071);
Map1.Clear();
Map1.MapMode = MapMode.Mode2D;
Map1.MapStyle = MapStyle.Aerial;
Map1.Center = yx;
Map1.ZoomLevel = 14;
Map1.ScaleBarDistanceUnit = DistanceUnit.Kilometers;
Map1.MouseWheelZoomToCenter = true;
Virtual Earth

Tampilan virtual earth. Lokasi : Monas

Tekan F5 untuk menjalankan aplikasi, hasilnya seperti gambar berikut

Menambahkan POI di virtual earth
Untuk menambahkan POI digunakan class shape. Pertama kita harus mendefinisikan objek POI yang akan di tampilkan di peta lengkap dengan koordinatnya.
Contoh:

protected void AddPOI(double lat, double lng, string keterangan)
{
   LatLongWithAltitude lokasi = new LatLongWithAltitude(lat, lng);
   Shape poi = new Shape(ShapeType.Pushpin, lokasi);
   poi.Description = keterangan;
   Map1.AddShape(poi);
}

Lat dan lng adalah variabel untuk menampung kooordinat lokasi dari POI. Keterangan merupakan variabel untuk memberikan informasi tentang objek POI.
Tambahkan kode berikut di event Page_Load

AddPOI(-6.17668, 106.830517, "Stasiun Gambir");
AddPOI(-6.170587, 106.838834, "Polsekta Sawah Besar");
AddPOI(-6.185592, 106.823724, "Hotel Sari Pan Pasifik");

Jalankan aplikasinya, akan terlihat titik di peta seperti gambar berikut

POI di virtual earth

Titik-titik POI yang telah diplotkan di virtual earth

Masih banyak class yang digunakan untuk memanipulasi informasi di Virtual Earth. Namun baru sebagian kecil ini saja di jelaskan di artikel ini. Silahkan di kembangkan lebih lanjut.

Happy Coding

About Yuniar

Penulis sekarang lebih banyak bekerja menggunakan teknologi Microsoft .NET secara umum dan TIDAK lagi menggunakan aplikasi MapXtreme.net dari MapInfo. Karena itu mohon maaf, jika pertanyaan-pertanyaan mengenai MapXtreme sudah tidak bisa saya jawab lagi.

Posted on 9 September 2009, in ASP.net, Web GIS and tagged , , . Bookmark the permalink. Tinggalkan komentar.

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s

%d blogger menyukai ini: