Ferry Kurniawan

Every Accomplishment Start With The Decision to Try
See also: Other Geeks@INDC
Mengkomsumsi oData di Aplikasi Windows Phone

oData adalah Open Protokol untuk mengkueri dan mengupdate data.  Protokol ini memperbolehkan anda mengkueri datasource melalui protokol http dimana data keluarannya adalah ATOM, JSON, XML. Berikut ini adalah langkah-langkah mengkomsumsi oData melalui aplikasi di Windows Phone.

I. Pembuatan WCF Data Service / oData

Yang pertama anda kerjakan adalah membuat layanan WCF Data Service. Untuk di tulisan ini tidak saya jelaskan lagi cara pembuatannya. Bagi anda yang ingin   melihat cara pembuatannya dapat di lihat di beberapa contoh blog disini.

Kasus yang kami berikan disini adalah mengakses WCF Data Service pada Tabel Language yang ada di Database Geeks. Berikut ini Gambarnya.

DB

Kemudian setelah kami buat Servicenya (pada alamat : http://localhost:1409/LanguageService.svc) maka akan tampil seperti berikut :

servis

 

II. Pembuatan Aplikasi Windows Phone untuk mengkomsumsi layanan diatas tadi.

1. Buatlah Proxy Class WCF Data Service tersebut dengan cara membuka Command Prompt

2. Kemudian masuk ke folder “C:\Windows\Microsoft.NET\Framework\v4.0.30319” (tergantung versi .net framework 4 anda )

3. Ketikkan perintah untuk membuat proxy class dengan mengetik perintah seperti berikut :

C:\Windows\Microsoft.Net\FrameWork\v4.0.30319> DataSvcUtil.exe /out:D:\Language.cs /uri:http://localhost:1409/LanguageService.svc /version:2.0

DVCUtil

4. Maka akan terbentuk class file Language.cs yang berada di folder : D:\Language.cs

5. Buatlah sebuah project Silverlight Windows Phone Application, beri nama KlienServiceLanguage.

6. Download WCF Data Service client library for Windows 7 phone disini. Install  (Extract ke folder di pc anda)

7. Maka akan terbentuk file System.Data.Services.Client.dll di Folder Tersebut.

8. Tambahkan Add Reference di Project Tersebut dengan cara pilih menu Project –> Add Reference . Kemudian cari file System.Data.Services.Client.dll yang tadi.

Refr

9. Buat satu buah Class, beri nama DataLanguage.cs . Ketikkan Perintah seperti berikut.

 

using System;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Ink;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;

namespace KlienServisLanguage
{
public class DataLanguage
{

public string ID { get; set; }
public string Bahasa { get; set; }
}
}

10. Tambahkan file Language.cs  (pada langkah Nomor 4 Tadi) ke project  dengan cara pilih  menu Project —> Add Existing Item.

11. Buka MainPage.xaml  tambakan satu buah Button dan Satu buah Listbox seperti berikut.

desainnya

12. Untuk file MainPage.xaml  nya seperti berikut ini.

<phone:PhoneApplicationPage 
x:Class="KlienServisLanguage.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
shell:SystemTray.IsVisible="True">

<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>

<!--TitlePanel contains the name of the application and page title-->
<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
<TextBlock x:Name="ApplicationTitle" Text="Geeks.Net.Indonesia" Style="{StaticResource PhoneTextNormalStyle}"/>
<TextBlock x:Name="PageTitle" Text="Consume oData" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}" FontSize="60" />
</StackPanel>

<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentGrid" Grid.Row="1">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="4*" />
</Grid.RowDefinitions>
<ListBox Grid.Row="1" x:Name="lstTampil"
ItemsSource="{Binding}" Height="458"
HorizontalAlignment="Left" Margin="20,39,0,0"
VerticalAlignment="Top" Width="435" >
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" >
<TextBlock Text="{Binding ID}" Foreground="Red"
Margin="20" />
<TextBlock Text="{Binding Bahasa}" Margin="20" />


</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<Button Content="Get Language" Height="72" HorizontalAlignment="Left" Margin="12,53,0,0" Name="btnGetData" VerticalAlignment="Top" Width="229" />
</Grid>
</Grid>



</phone:PhoneApplicationPage>

 

13. Untuk file MainPage.xaml .cs nya seperti berikut ini.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using Microsoft.Phone.Controls;
using System.Data.Services.Client;
using LanguageModel;

namespace KlienServisLanguage
{
public partial class MainPage : PhoneApplicationPage
{
LanguageEntities Lang = null;
List<Language> lstLang = null;
List<DataLanguage> lstResult = null;

// Constructor
public MainPage()
{
InitializeComponent();


InitializeComponent();
Lang = new LanguageEntities(new Uri("http://localhost:1049/LanguageService.svc/"));
lstLang = new List<Language>();
lstResult = new List<DataLanguage>();
SupportedOrientations = SupportedPageOrientation.Portrait | SupportedPageOrientation.Landscape;
btnGetData.Click += new RoutedEventHandler(btnGetData_Click);
}
void btnGetData_Click(object sender, RoutedEventArgs e)
{
var query = Lang.CreateQuery<Language>("Language");
query.BeginExecute(ar =>
{ TampilData(ar); }, query);
}

private void TampilData(IAsyncResult result)
{
DataServiceQuery<Language> Kueri = result.AsyncState as DataServiceQuery<Language>;
lstLang = Kueri.EndExecute(result).ToList();
Dispatcher.BeginInvoke(() =>
{
foreach (var L in lstLang)
{
lstResult.Add(new DataLanguage
{
ID = L.ID,
Bahasa = L.Bahasa
});

}
this.lstTampil.DataContext = lstResult;
});


}
}
}

 

14. Jalankan kemudian tekan tombol GetLanguage Maka akan tampil data dari WCF Data Service (http://localhost:1409/LanguageService.svc) tadi kami buat sebelumnya.

Jadinya

15. Project dapat didownload disini.  Terima Kasih & Semoga Bermanfaat :)

Share this post: | | | |
Membuat aplikasi Windows 7 Phone dengan VB?

Windows Phone 7 telah dirilis, bagi anda developer visual basic yang ingin mencoba membangun aplikasi Windows Phone 7 mungkin dapat bergembira Cool , karna Microsoft beberapa waktu yang lalu telah merilis "Microsoft Visual Basic CTP for Windows Phone Developer Tools" yang dapat diunduh disini.

 Berikut keterangan dari Microsoft :

“We’re not formally annoucing the schedule for when Visual Basic will be fully supported. We’re giving VB developers early access to the Windows Phone 7 platform so that they can start thinking about what amazing apps they want to build.”

 
CTP ini termasuk template, designer support, emulator (Phone), juga mendukung IntelliSense for Visual Basic. Tetapi ada beberapa batasan dari CTP ini :
  • As stated above you shouldn’t expect anything to be commercially ready.
  • Cannot build XNA Games ,only Silverlight apps allowed.
  • You should have at least a Visual Studio 2010 Professional license .
  • And you should not release the applications built using this release.

Bagi anda developer Visual Basic saya ucapkan selamat mencoba :)
Share this post: | | | |
Retrieve Spatial Data From Web Service

Data spatial yang ada di database SQL Server 2008 dapat anda integrasikan dengan Bing Maps atau dulu dikenal dengan nama Microsoft Virtual Earth. Pada kesempatan kali ini kami akan memberikan contoh bagaimana mengintergrasikan data spatial tersebut dengan Bing Maps dimana datanya dapat diambil melalui Web Service. Berikut ini langkahnya:

1. Buka SQL Server 2008 Management Studio anda

2. Buat tabel, insert data dan procedure di bawah ini pada Database yang ada di Instance anda.

   1: create Table MUGI
   2:   ( Kode varchar(1),
   3:     Wilayah varchar(50),
   4:     Keterangan varchar(100),
   5:     Lokasi geography
   6:   )
   7: GO
   8:  
   9: INSERT INTO MUGI VALUES (1, 'Jakarta', 'MUGI Regional Jakarta',
  10:  geography::Parse('POINT(106.90 -6.15)'))
  11:  
  12: INSERT INTO MUGI VALUES (2, 'Banjarmasin', 'MUGI Regional Banjarmasin',
  13:  geography::Parse('POINT(114.78 -3.16)'))
  14:  
  15: INSERT INTO MUGI VALUES (3, 'Surabaya', 'MUGI Regional Surabaya',
  16:  geography::Parse('POINT(112.78 -7.26)'))
  17:  
  18: INSERT INTO MUGI VALUES (4, 'Bandung', 'MUGI Regional Bandung',
  19:  geography::Parse('POINT(107.62 -6.92)'))
  20:  
  21: INSERT INTO MUGI VALUES (5, 'Makasar', 'MUGI Regional Makasar',
  22:  geography::Parse('POINT(119.41 -5.13)'))
  23:  
  24: GO
  25:  
  26: CREATE PROCEDURE getDaftarWilayah
  27: AS
  28:  BEGIN
  29:     SELECT  Wilayah,Keterangan,Lokasi 
  30:      FROM   MUGI 
  31:  END
  32: GO

3. Buat Project ASP .Net WebApplication Baru. Simpan dengan nama MugiSpatial. (disini kami menggunakan VB .Net)

4. Tambahkan satu class baru (simpan dengan nama DaftarWilayah.vb)

   1: Imports Microsoft.VisualBasic
   2:  
   3: Public Class DaftarWilayah
   4:     Private _Wilayah As String
   5:     Private _Keterangan As String
   6:     Private _Lat As Double = Double.MinValue
   7:     Private _Lot As Double = Double.MinValue
   8:  
   9:     Public Property Wilayah() As String
  10:         Get
  11:             Return _Wilayah
  12:         End Get
  13:         Set(ByVal value As String)
  14:             _Wilayah = value
  15:         End Set
  16:     End Property
  17:     Public Property Keterangan() As String
  18:         Get
  19:             Return _Keterangan
  20:         End Get
  21:         Set(ByVal value As String)
  22:             _Keterangan = value
  23:         End Set
  24:     End Property
  25:     Public Property Lat() As Double
  26:         Get
  27:             Return _Lat
  28:         End Get
  29:         Set(ByVal value As Double)
  30:             _Lat = value
  31:         End Set
  32:     End Property
  33:     Public Property Lon() As Double
  34:         Get
  35:             Return _Lot
  36:         End Get
  37:         Set(ByVal value As Double)
  38:             _Lot = value
  39:         End Set
  40:     End Property
  41: End Class
  42:  
  43:  

5. Tambahkan satu buah WebService Baru beri nama dengan MUGIService.asmx  , kemudian ketikkan code berikut ini.

   1: Imports System
   2: Imports System.Web.Services
   3: Imports System.Web.Services.Protocols
   4: Imports System.ComponentModel
   5: Imports System.Collections.Generic
   6: Imports System.Data
   7: Imports System.Data.SqlClient
   8: Imports System.Web.Script.Services
   9: Imports Microsoft.SqlServer.Types
  10:  
  11: Namespace MUGI
  12:     ' To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line.
  13:     <System.Web.Script.Services.ScriptService()> _
  14:     <System.Web.Services.WebService(Namespace:="http://tempuri.org/")> _
  15:     <System.Web.Services.WebServiceBinding(ConformsTo:=WsiProfiles.BasicProfile1_1)> _
  16:     <ToolboxItem(False)> _
  17:     Public Class MUGIService
  18:         Inherits System.Web.Services.WebService
  19:  
  20:         <WebMethod()> _
  21:         Public Function getRegional() As List(Of DaftarWilayah)
  22:  
  23:             Dim Daftars As New List(Of DaftarWilayah)
  24:             Dim con As New SqlConnection("Data Source=PDI-APP-LAPTOP\MOBILE;user id=sa;password=pa$$w0rd;initial catalog=testdb")
  25:             con.Open()
  26:             Dim cmd As New SqlCommand("dbo.getDaftarWilayah", con)
  27:             Dim rdr As SqlDataReader
  28:             rdr = cmd.ExecuteReader
  29:  
  30:             While rdr.Read
  31:                 Dim Daftar As New DaftarWilayah
  32:                 Daftar.Wilayah = rdr("Wilayah")
  33:                 Daftar.Keterangan = rdr("Keterangan")
  34:  
  35:                 Dim geo As New SqlGeography
  36:                 geo = DirectCast(rdr("Lokasi"), SqlGeography)
  37:                 Daftar.Lat = CDbl(geo.Lat)
  38:                 Daftar.Lon = CDbl(geo.Long)
  39:                 Daftars.Add(Daftar)
  40:             End While
  41:             rdr.Close()
  42:             con.Close()
  43:             Return Daftars
  44:         End Function
  45:  
  46:     End Class
  47:  
  48: End Namespace

Di Web Service ini terdapat satu buah function dimana mengembalikan data beserta posisi koordinat nya, yang ada di tabel MUGI yang tadi kita buat. Sesuaikan connection string anda masing-masing.

 

 

6. Buka halaman Default.aspx  kemudian ketikkkan script berikut ini.

   1: <%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="MUGI._Default" %>
   2:  
   3: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
   4:  
   5: <html xmlns="http://www.w3.org/1999/xhtml">
   6: <head runat="server">
   7:     <title>MUGI</title>
   8: </head>
   9: <body>
  10:     <form id="form1" runat="server">   
  11:     <asp:ScriptManager ID="ScriptManager1" runat="server">
  12:     <Services>
  13:       <asp:ServiceReference Path="MUGIService.asmx" />
  14:     </Services>
  15:     <Scripts>
  16:       <asp:ScriptReference
  17:         Path="http://dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6" />
  18:     </Scripts>
  19:   </asp:ScriptManager>
  20:   
  21:     <h1>Microsoft User Group Indonesia</h1>
  22:    
  23:   <input id="btnShowData" type="button" value="Tampilkan Peta"
  24:     onclick="btnShowData_Click()" />
  25:   <div>
  26:     <div id='divMUGI'
  27:       style="position: relative; width: 800px; height: 500px;" />
  28:         
  29:   </div>
  30:   &nbsp;
  31:   <script type="text/javascript"> 
  32:  
  33:     var _map = null; 
  34:  
  35:     function pageLoad() {
  36:         
  37:       _map = new VEMap('divMUGI');
  38:       _map.LoadMap(new VELatLong(-3, 114), 5, VEMapStyle.Road, false);
  39:       //_map.LoadMap(new VELatLong(-3, 114), 5, VEMapStyle.Road, false);
  40:     }
  41:  
  42:     function btnShowData_Click()
  43:     {
  44:         MugiSpatial.MUGI.MUGIService.getRegional
  45:         (OnDataRetrievalComplete);
  46:        //MugiSpatial.MUGIService.getRegional (OnDataRetrievalComplete);
  47:     }
  48:  
  49:     function OnDataRetrievalComplete(results)
  50:     {
  51:       for (i = 0; i < results.length; i++)
  52:       {
  53:         var point = new VELatLong(resultsIdea.Lat, resultsIdea.Lon);
  54:         var pin = new VEShape(VEShapeType.Pushpin, point);
  55:         pin.SetTitle(resultsIdea.Wilayah);
  56:         pin.SetDescription(resultsIdea.Keterangan);
  57:         _map.AddShape(pin);
  58:       }
  59:     }
  60:     </script>
  61:     </form>
  62: </body>
  63: </html>

Di halaman ini terdapat Script Manager yang mengakses web service kita buat tadi, kemudian akan menampilkan peta Bing Maps dimana terdapat pushpin beberapa regional Microsoft User Group Indonesia

7. Jalankan halaman Default.aspx, klik tombol tampilkan peta maka akan tampil seperti berikut ini. Berikut ini Peta Wilayah Regional Komunitas MUGI (Microsoft User Group Indonesia)

MUGI

8. Project dapat didownload disini

9. Terima Kasih & Semoga Bermanfaat.

Share this post: | | | |
QueryInterceptor di WCF Data Service

WCF Data Services (disebut juga dengan Astoria / ADO .Net Data Services di Framework 3.5) memungkinkan kita untuk memodifikasi data melaluli Interface HTTP RESTful. WCF Data Services ini mensupport beberapa kembalian data bertipe XML, JSon dan AtomPub. Pada kesempatan kali ini kami mencoba memberikan contoh bagaimana menggunakan QueryInterceptor data di WCF Data Service . Berikut ini langkah-langkahnya :

1. Buka VS 2010 anda.

2. Create New Project –> ASP .Net Empty Web Application (disini kami menggunakan VB .Net)

3. Simpan dengan nama AkademikDataService

4. Pilih Menu Project –> Add New Item……  ,  kemudian Pilih ADO .Net Entity Data Model

5. Beri Nama dengan AkademikModel.

6. Akan tampil jendela Choose Model Content.. , kemudian pilih Next.

1 

 

 

 

 

 

 

 

7. Setting Data Connection anda, (di contoh ini konek ke Database Akademik), jangan Lupa disimpan nama Entity Connection di Web Config

2 

3

8. Pilih database Objectnya. Dicontoh ini kami memilih Tabel yang ada di Database Akademik, kemudian tekan Finish.

4  5

10.  Pilih Menu Project –> Add New Item……  ,  kemudian Pilih WCF Data Service

11.  Beri Nama dengan AkademikDataService.svc

12.  Buka file AkademikDataService.svc.vb kemudian ketikkan code berikut :

      di Code ini terdapat perintah QueryInterceptor untuk mengembalikan data Mahasiswa yang namanya sesuai dengan user yang sedang login.

   1: Imports System.Data.Services
   2: Imports System.Data.Services.Common
   3: Imports System.Linq
   4: Imports System.ServiceModel.Web
   5: Imports System.Linq.Expressions
   6:  
   7: Public Class AkademikDataService
   8:     ' TODO: replace [[class name]] with your data class name
   9:     Inherits DataService(Of AkademikEntity)
  10:  
  11:     ' This method is called only once to initialize service-wide policies.
  12:     Public Shared Sub InitializeService(ByVal config As DataServiceConfiguration)
  13:         ' TODO: set rules to indicate which entity sets and service operations are visible, updatable, etc.
  14:         ' Examples:
  15:         config.SetEntitySetAccessRule("*", EntitySetRights.All)
  16:         ' config.SetServiceOperationAccessRule("MyServiceOperation", ServiceOperationRights.All)
  17:         config.DataServiceBehavior.MaxProtocolVersion = DataServiceProtocolVersion.V2
  18:     End Sub
  19:  
  20:     <QueryInterceptor("Mahasiswas")> _
  21:     Public Function OnQueryMahasiswas() As Expression(Of Func(Of Mahasiswa, Boolean))
  22:         Dim Nama() As String
  23:         Nama = Split(HttpContext.Current.User.Identity.Name, "\", 0, CompareMethod.Text)
  24:  
  25:         Return Function(m As Mahasiswa) m.Nama = Nama(1)
  26:     End Function
  27: End Class

13. Jalankan AkademikDataService.svc maka akan tampil

6

14. Tambahkan New Project  “ASP .Net Empty Web Application” Melalui File –> Add –> New Project

15. Beri Nama dengan WCFClient

16 Tambahkan Satu Buah WebForm berinama dengan Default.aspx

17. Buat Tampilan Seperti Berikut ini (Button dan GridView).

9

18. Tambahkan Service Reference melalui Menu Project –> Add Service Reference…

19. Kemudian ketikkan “http://localhost:1065/AkademikDataService.svc/”  pada TextBox Address, beri nama ServiceAkademik

20. Ketikkan code berikut ini di Default.aspx.vb

   1: Imports System.Data.Services.Client
   2: Imports WCFClient.ServiceAkademik
   3: Imports System.Data.Services
   4: Imports System.Data.Services.Common
   5: Imports System.Linq
   6: Imports System.Linq.Expressions
   7: Imports System.ServiceModel
   8: Public Class _Default
   9:     Inherits System.Web.UI.Page
  10:  
  11:  
  12:     Protected Sub btnSimpan_Click(ByVal sender As Object, ByVal e As EventArgs) Handles btnLoad.Click
  13:         LoadGrid()
  14:     End Sub
  15:     Sub LoadGrid()
  16:         Dim svc As New AkademikEntity(New Uri("http://localhost:1065/AkademikDataService.svc/"))
  17:         GridView2.DataSource = svc.Mahasiswas
  18:         GridView2.DataBind()
  19:     End Sub
  20:  
  21:    
  22: End Class

21. Jalankan Default.aspx maka akan tampil berikut ini

 

 

 

 

 

 

 

 

 

 

 

 

 

 

11

22. Sebelumnya saya login dengan user ferry  (ditampung di HttpContext.Current.User.Identity.Name), maka QueryInterceptor yang ada di AkademikDataSerivice akan meng-query data Mahasiswa yang namanya sesuai dengan user yang login (tidak dapat melihat data user lainnya).

23. Terima Kasih & Semoga Bermanfaat :)

Share this post: | | | |
SQL Query to Finding Nearest Neighbours (Spatial Data)

SQL Server 2008 menyediakan beberapa fungsi yang mendukung tipe data Basis data Spasial (geometry / geography). Untuk menghitung jarak antara dua instances anda dapat menggunakan fungsi STDistance() . Contoh penerapannya seperti berikut :

Query Berikut ini mencari 10 titik terdekat dengan titik  POINT (210000 890000) di tabel Customer

   1: DECLARE @Point geometry
   2: SET @Point = geometry::STPointFromText('POINT (210000 890000)', 26986)
   3: SELECT TOP 10
   4:   Nama
   5:   Alamat,  
   6:   Lokasi.STDistance(@Point) AS Jarak
   7: FROM
   8:   Customer
   9: ORDER BY
  10:   Lokasi.STDistance(@Point)  ASC

Query diatas benar dan dapat dijalankan namun  ternyata kurang efisien karna akan menscan semua row kemudian baru diurutkan (memerlukan waktu). Solusi yang dapat digunakan untuk memberikan efisiensi maka anda dapat menggunakan tambahan fungsi STBuffer() dan Filter() seperti berikut :

   1: DECLARE @Point geometry
   2: SET @Point = geometry::STPointFromText('POINT (210000 890000)', 26986)
   3:  
   4: DECLARE @Cari geometry
   5: SET @Cari = @Point.STBuffer(500)
   6:  
   7: SELECT TOP 10
   8:   Nama
   9:   Alamat,  
  10:   Lokasi.STDistance(@Point) AS Jarak
  11: FROM
  12:   Customer
  13: WHERE
  14:   Lokasi.Filter(@Cari) = 1

Query tersebut akan mencari 10 titik terdekat namun sudah difilter terlebih dahulu yang berada dalam radius 500 meter.

Implementasi di Web Application (menggunakan control ASPMap)

1. Download dan Attach Database GIS yang dapat diunduh disini.

2. Buatlah Stored Procedure seperti berikut ini

   1: Create procedure [dbo].getPoint(@x float , @y float,@tipe varchar(30))  
   2: as
   3: Begin
   4: DECLARE @titik geometry
   5: SET @titik =  geometry::Point(@x,@y,0)
   6: DECLARE @cari geometry
   7: SET @cari = @titik.STBuffer(0.005)
   8:  
   9: SELECT [name]
  10:       ,[type]
  11:       ,[geom].STAsText(),
  12:       geom.STDistance(@titik) AS Distance
  13: FROM
  14:   points 
  15: WHERE
  16: geom.Filter(@cari) = 1
  17: and [type]=@tipe
  18: End

3. Buka Visual Studio anda buat website baru, beri nama dengan GazaMap kemudian tambahkan ASPMap control ke halaman default.aspx seperti berikut :

1

4. Tambahkan Code seperti berikut.

   1: Imports System
   2: Imports System.Data
   3: Imports System.Data.SqlClient
   4: Imports AspMap
   5: Imports AspMap.Web
   6: Partial Class _Default
   7:     Inherits System.Web.UI.Page
   8:     Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
   9:         LayerFromSHP()
  10:         If IsPostBack = False Then
  11:             LoadBangunan()
  12:         End If
  13:     End Sub
  14:     Private Sub LayerFromSHP()
  15:         Dim layer As AspMap.Layer
  16:         Map1.MapUnit = MeasureUnit.Meter
  17:         Dim MapDir As String = MapPath("MAP/")
  18:         layer = Map1.AddLayer(MapDir & "roads.shp")
  19:         layer.LabelField = "name"
  20:         layer.ShowLabels = True
  21:         layer.LabelFont.Color = Drawing.Color.Indigo
  22:         layer.LabelFont.Name = "Verdana"
  23:         layer.LabelFont.Size = 12
  24:         layer.LabelFont.Bold = True
  25:         layer.LabelStyle = LabelStyle.Default
  26:     End Sub
  27:     Private Sub LoadLayerFromDB(ByVal x As Double, ByVal y As Double, ByVal strTipe As String)
  28:         Dim cn As New SqlConnection("Data Source=PDI-APP-LAPTOP\MOBILE;Initial Catalog=GIS;Trusted_Connection=yes;")
  29:         cn.Open()
  30:         Dim cmd As New SqlCommand("getPoint " & x & "," & y & ",'" & strTipe & "'", cn)
  31:         Dim rdr As SqlDataReader
  32:  
  33:         Map1.Markers.Clear()
  34:         rdr = cmd.ExecuteReader()
  35:         While rdr.Read
  36:             Dim strTemp() As String
  37:             Dim strPoint As String
  38:             Dim intPosisi As Byte
  39:             intPosisi = InStr(Trim("" & rdr(2)), "(", CompareMethod.Text)
  40:             strPoint = Right(Trim("" & rdr(2)), Len(Trim("" & rdr(2))) - intPosisi)
  41:             strPoint = Left(strPoint, Len(strPoint) - 1)
  42:             strTemp = Split(strPoint, " ")
  43:  
  44:             Dim marker As Marker = New Marker(New AspMap.Point(Val(strTemp(0)), Val(strTemp(1))), Trim("" & rdr(0)), "Nama Bangunan : " & Trim("" & rdr(0)) & "<BR>" & "Jarak dari titik : " & Val("" & rdr(3)).ToString)
  45:             Map1.Markers.Add(marker)
  46:  
  47:         End While
  48:         rdr.Close()
  49:         cmd = Nothing
  50:         cn.Close()
  51:         cn = Nothing
  52:     End Sub
  53:     Sub LoadBangunan()
  54:         Dim cn As New SqlConnection("Data Source=PDI-APP-LAPTOP\MOBILE;Initial Catalog=GIS;Trusted_Connection=yes;")
  55:         cn.Open()
  56:         Dim cmd As New SqlCommand("SELECT DISTINCT [type]   FROM  [points]", cn)
  57:         Dim rdr As SqlDataReader
  58:  
  59:         ddlTipe.Items.Clear()
  60:         rdr = cmd.ExecuteReader()
  61:         While rdr.Read
  62:             ddlTipe.Items.Add(Trim("" & rdr(0)))
  63:         End While
  64:         rdr.Close()
  65:         cmd = Nothing
  66:         cn.Close()
  67:         cn = Nothing
  68:     End Sub
  69:     Protected Sub Map1_InfoTool(ByVal sender As Object, ByVal e As AspMap.Web.InfoToolEventArgs) Handles Map1.InfoTool
  70:         Dim Titik As New AspMap.Point
  71:         Titik = e.InfoPoint
  72:         LoadLayerFromDB(Titik.X, Titik.Y, ddlTipe.SelectedValue)
  73:     End Sub
  74: End Class

5. Jalankan kemudian pilih tipe bangunannya, klik icon InfoTool klik peta  di sembarang Peta “Gaza” maka akan tampil bangunan terdekat seperti berikut.

 

2

3

 

6. Source Code dapat didownload disini

7. Selamat mencoba, Semoga Bermanfaat dan Terima Kasih.

8. Tak lupa saya berdoa semoga bumi Palestina selalu dalam lindungan ALLAH S.W.T  dan Semoga tercipta Perdamaian di Timur Tengah. Amin.

Share this post: | | | |
Display Maps from online WMS Servers

Web Map Service (WMS) adalah protokol standar untuk melayani rujukan geografis gambar peta melalui internet yang dihasilkan oleh server peta menggunakan data dari GIS database. Contoh WMS Server dari negeri sendiri yang bisa anda rujuk adalah :

- WMS Kementrian Kehutanan : http://appgis.dephut.go.id/appgis/

- WMS Kota Samarinda   (Kalimantan Timur) : http://www.samarindacity.com/wms/

Sebagai contoh disini saya akan menampilkan Peta Kota Samarinda melalui WMS nya yang diatas. Untuk menampilkan peta tersebut saya masih menggunakan control ASPMap seperti yang saya tulis disini dan disini.  Untuk detil informasi WMS Kota Samarinda  dapat anda rujuk ke http://www.samarindacity.com/wms/?SERVICE=wms&VERSION=1.1.1&REQUEST=GetCapabilities

Berikut ini langkah-langkahnya menampilkan Peta Kota Samarinda dari WMS Servernya :

1. Buka Visual Studio anda. Buat New Website Beri nama dengan Samarinda. (disini menggunakan VB .Net)

2. Tambahkan control ASPMap dan control ZoomBar ke halaman Default.aspx, Seperti Berikut :

1

3. Ketikkan code berikut ini di Default.aspx.vb   untuk menampilkan petanya ke control Map1

   1: Imports Microsoft.VisualBasic
   2: Imports System
   3: Imports System.Collections
   4: Imports System.ComponentModel
   5: Imports System.Data
   6: Imports System.Data.SqlClient
   7: Imports System.Drawing
   8: Imports System.Web
   9: Imports System.Web.SessionState
  10: Imports System.Web.UI
  11: Imports System.Web.UI.WebControls
  12: Imports System.Web.UI.HtmlControls
  13: Imports AspMap
  14: Imports AspMap.Web
  15: Partial Public Class _Default
  16:     Inherits System.Web.UI.Page
  17:     Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
  18:         DisplayMap()
  19:     End Sub
  20:     Sub DisplayMap()
  21:         ' akses wms server
  22:         Dim wms As WmsLayer = New WmsLayer("http://www.samarindacity.com/wms/", New AspMap.Rectangle(117.048, 0.319929, 117.302, -0.716833))
  23:         ' menambahkan layer
  24:         wms.AddLayer("kecamatan")
  25:         wms.AddLayer("kelurahan")
  26:         wms.AddLayer("jalan")
  27:         wms.AddLayer("nama_jalan")
  28:  
  29:         wms.ImageFormat = ImageFormat.Png
  30:         ' add the WMS layer to the map
  31:         Dim wmsLayer As AspMap.Layer = Map1.AddLayer(wms)
  32:         ' set the coordinate system of the map to the coordinate system of the TerraServer layer
  33:         Map1.CoordinateSystem = CoordSystem.WGS1984
  34:         ' make the map image transparent to display background WMS layers
  35:         Map1.ImageOpacity = 0
  36:     End Sub
  37: End Class

4. Jalankan halaman tersebut maka akan tampil seperti berikut ini.

2

5. Selamat Mencoba, Terima Kasih & Semoga Bermanfaat :)

6. Source dapat diunduh disini.

Share this post: | | | |
Creating WCF Client in Windows Mobile

Setelah satu bulan tidak menulis di blog (dikarnakan keikut-sertaan saya dalam mengurus putri pertama saya yang baru lahir :-) ) , maka pada kesempatan kali ini saya akan sedikit berbagi tulisan mengenai pembuatan “WCF Client di Windows Mobile”. Meskipun windows phone 7 sudah diluncurkan pada tahun ini tetapi saya tetap mengutak-atik mengenai pengembangan windows mobile 6.5 kebawah yang tentunya dengan .Net Compact Frameworknya. Untuk penjelasan WCF dengan konsep ABC (Address, Binding, Contract ) tidak saya bahas ulang. Berikut ini langkah-langkahnya:

I. Pembuatan WCF Service :

1. Buka VS 2008 anda.

2. Buat project “WCF Service Library” baru kemudian beri nama dengan WCFLanguage (disini memakai  C#)

3. Kemudian kopikan code dibawah ini di file app.config project tersebut

    Catatan : - Address Host saya gunakan : http://192.168.10.68:8282/WCFLanguage/Language

                   - EndPoint  : <endpoint address="mex"   binding="mexHttpBinding"  contract="IMetadataExchange"/>

                   - Ganti sesuai settingan anda

   1: <?xml version="1.0" encoding="utf-8" ?>
   2: <configuration>
   3:   <system.web>
   4:     <compilation debug="true" />
   5:   </system.web>
   6:   <!-- When deploying the service library project, the content
   7: of the config file must be added to the host's app.config
   8: file. System.Configuration does not support config files
   9: for libraries. -->
  10:   <system.serviceModel>
  11:     <services>
  12:       <service name="WCFLanguage.Language"
  13:       behaviorConfiguration="WCFLanguage.LanguageBehavior">
  14:         <host>
  15:           <baseAddresses>
  16:             <add baseAddress ="http://192.168.10.68:8282/WCFLanguage/Language" />
  17:           </baseAddresses>
  18:         </host>
  19:         <!-- Service Endpoints -->
  20:         <!-- Unless fully qualified, address is relative to
  21: base address supplied above -->
  22:         <endpoint address =""
  23:         binding="basicHttpBinding"
  24:         contract="WCFLanguage.ILanguage" />
  25:         <!--
  26: Upon deployment, the following identity element
  27: should be removed or replaced.
  28: -->
  29:         <!-- Metadata Endpoints -->
  30:         <endpoint address="mex"
  31:         binding="mexHttpBinding"
  32:         contract="IMetadataExchange"/>
  33:       </service>
  34:       
  35:     </services>
  36:     <behaviors>
  37:       <serviceBehaviors>
  38:         <behavior name="WCFLanguage.LanguageBehavior">
  39:           <!-- To avoid disclosing metadata information,
  40: set the value below to false and remove the metadata
  41: endpoint above before deployment -->
  42:           <serviceMetadata httpGetEnabled="True"/>
  43:           <!-- To receive exception details in faults for
  44: debugging purposes, set the value below to true.
  45: Set to false before deployment to avoid disclosing
  46: exception information -->
  47:           <serviceDebug includeExceptionDetailInFaults="False" />
  48:         </behavior>
  49:  
  50:       </serviceBehaviors>
  51:     </behaviors>
  52:   </system.serviceModel>
  53: </configuration>

4. Ganti nama file IService1.cs ke ILanguage.cs untuk pembuatan Interface yang digunakan dalam pendefinisian contract Language.

    Kemudian ketikkan code berikut ini.

   1: using System;
   2: using System.Collections.Generic;
   3: using System.Linq;
   4: using System.Runtime.Serialization;
   5: using System.ServiceModel;
   6: using System.Text;
   7:  
   8: namespace WCFLanguage
   9: {
  10:     
  11:     [ServiceContract]
  12:     public interface ILanguage
  13:     {
  14:         [OperationContract]
  15:         string[] GetAllLanguages();
  16:         [OperationContract]
  17:         string ChooseLanguage(string Code);
  18:         
  19:     }
  20:  
  21:    
  22:     [DataContract]
  23:     public class DataLanguage
  24:     {
  25:         string strLanguage = "";
  26:         string strResult = "";
  27:  
  28:         [DataMember]
  29:         public string StringLanguage
  30:         {
  31:             get { return strLanguage; }
  32:             set { strLanguage = value; }
  33:         }
  34:  
  35:         [DataMember]
  36:         public string StringResult
  37:         {
  38:             get { return strResult; }
  39:             set { strResult = value; }
  40:         }
  41:     }
  42: }

 

5. Ganti nama file Service1.cs menjadi Language.cs kemudian ketikkan code berikut ini.

   1: using System;
   2: using System.Collections.Generic;
   3: using System.Linq;
   4: using System.Runtime.Serialization;
   5: using System.ServiceModel;
   6: using System.Text;
   7:  
   8: namespace WCFLanguage
   9: {
  10:     // NOTE: If you change the class name "Service1" here, you must also update the reference to "Service1" in App.config.
  11:     public class Language : ILanguage
  12:     {
  13:         public string[] GetAllLanguages()
  14:         {
  15:             string[] strLanguages = new string[3];
  16:             strLanguages[0] = "C#";
  17:             strLanguages[1] = "F#";
  18:             strLanguages[2] = "VB .Net";
  19:  
  20:             return strLanguages;
  21:         }
  22:         public string ChooseLanguage(string Code)
  23:         {
  24:             string strResult = "";
  25:             if (Code == "C#")
  26:             {
  27:                 strResult = "Amazing language";
  28:             }
  29:             else if (Code == "F#")
  30:             {
  31:                 strResult = "Interesting New Language";
  32:             }
  33:             else if (Code == "VB .Net")
  34:             {
  35:                 strResult = "Familiar Language";
  36:             }
  37:             return strResult;
  38:         }
  39:  
  40:         public DataLanguage YourFavLanguage (string Code)
  41:         {
  42:             var L = new DataLanguage();
  43:             L.StringLanguage  = Code;
  44:  
  45:             string strResult = "";
  46:             strResult = ChooseLanguage(L.StringLanguage);
  47:             L.StringResult = strResult;
  48:             return L;
  49:  
  50:         }
  51:     }
  52: }

6. Jalankan project tersebut maka akan tampil seperti berikut. Service WCFLanguage siap diimplementasikan.

2

II. Pembuatan WCF Client di Windows Mobile.

1. Download .Net Compact Framework Power Toys 3.5 disini, kemudian install.

2. Pada project tadi pilh menu File –> Add –> New Project.

3. Pilih SmartDevice (C#), kemudian simpan dengan nama WMClient.

4. Target Device ke Windows Mobile 6

5. Tambahkan namespace System.Runtime.Serialization dan System.ServiceModel melalui Add References

6. Kopikan file WCFLanguage.dll (di folder project anda) ke path “C:\Program Files\Microsoft.NET\SDK\CompactFramework\v3.5\bin

7. Jalankan Service WCFLanguage tadi (Point I.6)

8. Buka Command Prompt kemudian ketikkan “CD C:\Program Files\Microsoft.NET\SDK\CompactFramework\v3.5\bin”

9. Ketikkan di Command prompt tadi seperti berikut “NETCFSvcUtil.exe http://192.168.10.68:8282/WCFLanguage/Language

10. Ketikkan di Command prompt seperti berikut “NETCFSvcUtil.exe WCFLanguage.dll

11. Ketikkan di Command prompt seperti berikut “NETCFSvcUtil.exe *.wsdl *.xsd”

12. Kembali ke project WMClient anda, kemudian buat tampilan seperti berikut ini.

3

13. Pilih menu Project –> Add Existing Item. Kemudian buka path “C:\Program Files\Microsoft.NET\SDK\CompactFramework\v3.5\bin”

      Tambahkan file Language.cs dan CFClientBase.cs ke project tersebut.

13. Ketikkan di code berikut ini di Form1.cs

   1: using System;
   2: using System.Linq;
   3: using System.Collections.Generic;
   4: using System.ComponentModel;
   5: using System.Data;
   6: using System.Drawing;
   7: using System.Text;
   9: using System.Runtime.Serialization;
  10: using System.ServiceModel;
   8: using System.Windows.Forms;
  11:  
  12:  
  13: namespace WMClient
  14: {
  15:     public partial class Form1 : Form
  16:     {
  17:         public Form1()
  18:         {
  19:             InitializeComponent();
  20:         }
  21:  
  22:         private void button1_Click(object sender, EventArgs e)
  23:         {
  24:  
  25:             var l = new LanguageClient();
  26:             MessageBox.Show(l.ChooseLanguage(cboLanguage.SelectedItem.ToString()));
  27:  
  28:             
  29:            
  30:         }
  31:  
  32:         private void Form1_Load(object sender, EventArgs e)
  33:         {
  34:             var l = new LanguageClient();
  35:             string[] strLang = l.GetAllLanguages();
  36:  
  37:             cboLanguage.Items.Clear();
  38:             foreach (string str in strLang)
  39:             {
  40:                 cboLanguage.Items.Add(str);
  41:             }
  42:             cboLanguage.SelectedIndex = 0;
  43:             l = null;
  44:  
  45:         }
  46:  
  47:        
  48:     }
  49: }

14. Jalankan Service WCFLanguage tadi (Point I.6)

15 Kemudian jalankan pula Project SmartDevice WMClient melalui Klik Kanan –> Debug –> Start New Instance

16. Hasil akhir seperti berikut ini.

4

17. Source code dapat diunduh disini

18. Terima Kasih dan Semoga Bermanfaat :)

Share this post: | | | |
Presenting Spatial Data Using ASPMap Part II

Pada kesempatan kedua ini, kami akan mencoba menampilkan data spatial di SQL Server 2008 dengan menggunakan ASPMap Control seperti di cotoh sebelumnya. Pada contoh di kasus ini ialah menampilkan lokasi Airport yang berada di Amerika. Berikut ini langkah-langkahnya :

1.  Download database DbUSA dan attach ke database SQL Server 2008 anda linknya disini.

2. Buat Website baru beri nama dengan USAirports.  Kemudian tambahkan control DropDownlist ke dalam Default.aspx. Beri nama control tersebut dengan nama ddlState.

ASP_1

3. Tambahkan New Folder di website anda kemudian rename menjadi MAP. Tambahkan semua  file yang berada di folder “C:\Program Files\VDS Technologies\AspMap 4.5\DATA\MAPS\USA” seperti di gambar .

ASP_3

4. Tambahkan New Folder lagi di website anda kemudian rename menjadi Icon. Tambahkan 5 file .gif  yang berada di folder “C:\Program Files\VDS Technologies\AspMap 4.5\DATA\TOOLS” seperti di gambar .

ASP_2

7. Drag n Drop 1 buah control Map kedalam web form Default.aspx

6. Drag n Drop  3 buah  control MapToolButton kedalam Default.aspx

Name ImageURL Map MapTool
zoomin ~/Icon/Zoomin.gif Map1 ZoomIn
zoomout ~/Icon/Zooout.gif Map1 Zoomout
pan ~/Icon/pan.gif Map1 Pan

ASP_4

7. Ketikkan code berikut ini (VB .Net)  kedalam Default.aspx.vb

Imports AspMap
Imports AspMap.Web
Imports System
Imports System.Data
Imports System.Data.SqlClient
Partial Class _Default
    Inherits System.Web.UI.Page
    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        If Not IsPostBack Then
            LoadStates()
        End If
        LoadLayer()
    End Sub
    Protected Sub ddlState_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles ddlState.SelectedIndexChanged
        getAirport(ddlState.SelectedValue)
    End Sub
    Sub LoadLayer()
        Dim layer As AspMap.Layer
        Dim MapDir As String = MapPath("MAP/")
 
        ' add states layer
        layer = Map1.AddLayer(MapDir & "states.shp")
        layer.LabelField = "STATE_NAME"
        layer.ShowLabels = True
        layer.LabelFont.Name = "Verdana"
        layer.LabelFont.Size = 12
        layer.LabelFont.Bold = True
        layer.LabelStyle = LabelStyle.PolygonCenter
 
        ' add roads layer
        layer = Map1.AddLayer(MapDir & "roads.shp")
 
        
    End Sub
    Sub LoadStates()
        Dim cn As New SqlConnection("Data Source=pdi-app-laptop\mobile;Initial Catalog=DbUSA;Trusted_Connection=yes;")
        cn.Open()
 
        Dim cmd As New SqlCommand("select distinct [STATE_NAME],STATE_ABBR from [STATES] order by STATE_NAME", cn)
        Dim rdr As SqlDataReader
        rdr = cmd.ExecuteReader
 
        ddlState.Items.Clear()
 
 
        While rdr.Read
            Dim li As New ListItem
            li.Text = Trim("" & rdr(0))
            li.Value = Trim("" & rdr(1))
            ddlState.Items.Add(li)
        End While
        rdr.Close()
        rdr = Nothing
        cmd = Nothing
        cn.Close()
        cn = Nothing
    End Sub
    Sub getAirport(ByVal strState As String)
        Dim cn As New SqlConnection("Data Source=pdi-app-laptop\mobile;Initial Catalog=DbUSA;Trusted_Connection=yes;")
        cn.Open()
 
        Dim cmd As New SqlCommand("select [NAME], [Location].STAsText() from [Airports] where STATE ='" & strState & "'", cn)
        Dim rdr As SqlDataReader
        rdr = cmd.ExecuteReader
 
 
        Map1.Markers.Clear()
        lblFound.Text = ""
        Dim count As Integer
        count = 0
        While rdr.Read
            Dim symbol As New MarkerSymbol("icon/marker.gif", 19, 31)
            Dim x As Double
            Dim y As Double
            Dim tmp As String
            Dim pos As Byte
 
            tmp = Left(Trim("" & rdr(1)), Len(Trim("" & rdr(1))) - 1)
            pos = InStr(tmp, "(", CompareMethod.Text)
            tmp = Right(tmp, Len(tmp) - pos)
 
            Dim arrXY() As String
            arrXY = Split(Trim(tmp), " ", , CompareMethod.Text)
 
            x = arrXY(0)
            y = arrXY(1)
 
            Dim marker As New Marker(New AspMap.Point(x, y), symbol, rdr(0))
            Map1.Markers.Add(marker)
 
            arrXY = Nothing
            count = count + 1
        End While
 
        lblFound.Text = count.ToString & " Airports Found "
 
        rdr.Close()
        rdr = Nothing
        cmd = Nothing
        cn.Close()
        cn = Nothing
    End Sub
 
    
    
End Class

Penjelasan :

- Sub LoadLayer() : untuk menampilkan layer States.shp dan Road.shp ke dalam Map.

- Sub LoadStates() : untuk menampilkan nama-nama states ke di USA ke dalam ddlState (dropdownlist)

- Sub getAirport(ByVal strState As String) : untuk menampilkan data airport sesuai dengan nama state yang dipilih. Data yang dipilih dicari ke database DbUSA tabel Airports kemudian dicari posisi koordinatnya (dengan kueri STAsText() ) lalu membuat Marker / Penanda untuk lokasi dari Airport tersebut (ditampilkan dengan icon marker.gif)

8. Jalankan Default.aspx kemudian pilih salah satu nama state nya maka akan tampil lokasi Airport di wilayah state tersebut.

ASP_5

yang berwarna merah adalah marker untuk lokasi Airport di State tsb.

ASP_6

9. Semoga Bermanfaat & Terima Kasih :)

10. Source Code dapat didownload disini.

Share this post: | | | |
Presenting Spatial Data Using ASPMap Control Part I

Beberapa hari terakhir ini saya mencoba beberapa control untuk menampilkan data spatial di SQL Server 2008. Untuk kesempatan yang pertama ini saya mencoba web mapping component ASPMap dari VDS Technologies (dapat didownload disini). Component ini didesain cukup powerfull untuk pengembangan aplikasi “data spatial”. Pada contoh yang pertama ini saya juga mencoba juga menggunakan Visual Studio 2010 :). Berikut ini langkah-langkahnya :

1. Download file .mdf untuk database DbUSA yang akan kita gunakan di contoh ini (download disini)

2. Extract file .rar tersebut kemudian attach ke database SQL Server 2008 anda. Maka database DbUSA akan siap digunakan.

DB  DB2

3. Buka Visual Studio 2010 anda kemudian buat New Website, simpan dengan nama USAMap. Buat tampilannya seperti berikut.

ASP_1

4. Tambahkan Tab Baru di ToolBox anda dengan cara Add Tab, kemudian simpan dengan nama ASP Map. Pada Tab tersebut klik kanan –> choose items. Cari file AspMapNET.dll  di Folder “C:\Program Files\VDS Technologies\AspMap 4.5\BIN” sampai tampil seperti berikut ini.

ASP_2

5. Tambahkan New Folder di website anda kemudian rename menjadi MAP. Tambahkan 3 file yang berada di folder “C:\Program Files\VDS Technologies\AspMap 4.5\DATA\MAPS\USA” seperti di gambar .

ASP_3

6. Tambahkan New Folder lagi di website anda kemudian rename menjadi Icon. Tambahkan 4 file .gif  yang berada di folder “C:\Program Files\VDS Technologies\AspMap 4.5\DATA\TOOLS” seperti di gambar .

ASP_4

7. Drag n Drop 1 buah control Map kedalam web form Default.aspx

8. Drag n Drop  3 buah  control MapToolButton kedalam Default.aspx

Name ImageURL Map MapTool
zoomin ~/Icon/Zoomin.gif Map1 ZoomIn
zoomout ~/Icon/Zooout.gif Map1 Zoomout
pan ~/Icon/pan.gif Map1 Pan

ASP_5

9. Ketikkan code berikut ini (vb.net) di dalam Default.aspx.vb. 

Imports System
Imports System.Data
Imports System.Data.SqlClient
Imports AspMap
Imports AspMap.Web
Partial Class _Default
    Inherits System.Web.UI.Page
 
    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        LoadLayerFromShp()
        LoadLayerFromDB()
    End Sub
    Private Sub LoadLayerFromShp()
        Dim layer As AspMap.Layer
        Dim MapDir As String = MapPath("MAP/")
        layer = Map1.AddLayer(MapDir & "states.shp")
    End Sub
    Private Sub LoadLayerFromDB()
        Dim strKueri As String = "SELECT *, geom.STAsBinary() AS geomWKB FROM cities"
        Dim cnString As String = "Data Source=pdi-app-laptop\mobile;Initial Catalog=DbUSA;Trusted_Connection=yes;"
 
        Dim da As SqlDataAdapter = New SqlDataAdapter(strKueri, cnString)
        Dim dt As DataTable = New DataTable()
 
        da.Fill(dt)
        da.Dispose()
 
        Dim Layer As Layer = Map1.AddSpatialDataLayer(dt, "geomWKB")
        Layer.LabelField = "CITY_NAME"
        Layer.ShowLabels = True
        Layer.LabelFont.Name = "Verdana"
        Layer.LabelFont.Size = 10
        Layer.LabelFont.Bold = True
        Layer.LabelStyle = LabelStyle.Default
 
    End Sub
    
End Class

Penjelasan :

- Sub LoadLayerFromShp() untuk menampilkan Layer dari file .shp untuk di contoh ini ialah file states.shp

- Sub LoadLayerFromDB() untuk menampilkan layer dari Database DbUSA Tabel cities. Dengan kueri  select ………., nama.kolom.STAsBinary() from tabel  maka data spatial tsb dapat ditampilkan. untuk menampilkan label dari cities tsb dapat anda gunakan perintah layer.showlabels = true, layer.labelfield = namakolom.

10. Jalankan di browser maka tampil map states.shp dan kemudian diatasnya ada layer cities yang diambil dari Database DbUSA. Gunakan zoom in dan zoom out ataupun pan untuk memilih kotanya.

ASP_6

yang berwarna merah adalah nama kota yang diambil dari database.

ASP_7

11. Semoga bermanfaat & Terima Kasih :)

12. Source dapat didownload disini.

Share this post: | | | |
.Net Assembly untuk Mengkonversi Koordinat UTM / Geographic di SQL Server 2008

Sebelum memulai penjelasan tentang “Converter” koordinat UTM ke Geographic ataupun sebaliknya maka ada baiknya kami berikan sedikit pengertian tentang Longitude, Latitude, UTM.

  • Longitude / Garis Bujur : Menggambarkan lokasi sebuah tempat di timur  atau barat Bumi dari sebuah garis utara-selatan yang disebut Meridian Utama.  Longitude diberikan berdasarkan pengukuran sudut yang berkisar dari 0° di Meridian Utama ke +180° arah timur dan -180°  arah barat
  • Latitude / Garis Lintang : garis khayal yang digunakan untuk menentukan lokasi di Bumi terhadap garis khatulistiwa (utara atau selatan). Posisi lintang biasanya dinotasikan dengan simbol huruf Yunani f. Posisi lintang merupakan penghitungan sudut dari 0° di khatulistiwa sampai ke +90° di kutub utara dan -90° di kutub selatan.  Dalam bahasa Indonesia lintang di sebelah utara khatulistiwa diberi nama Lintang Utara (LU), demikian pula lintang di sebelah selatan khatulistiwa diberi nama Lintang Selatan (LS)

Posisi Koordinat Geographic sendiri adalah gabungan antara koordinat Longitude, Latitude misalkan letak Kota Banjarmasin berada pada Posisi Longitude : 114.4xxxx  dan Posisi Latitude : -3.2xxxx   (dapat dilihat pada gambar)

lat-lng-grid

Posisi Koordinat Universal Transverse Mercator (UTM) sendiri adalah metode menentukan posisi koordinat bumi dengan memetakannya secara 2 dimensi dimana dibagi-bagi menjadi kotak-kotak kecil (lokal). Saya contohkan disini misalkan Kota Banjarmasin berada pada Zona 50 S ( South / Selatan). (dapat dilihat pada gambar)

gc1990-utm_zones_on_worldmap

Seperti diketahui bersama bahwa SQL Server 2008  telah mendukung Data Spatial, ini berarti dapat menyimpan Data Spatial dari kedua contoh metode penentuan koordinat diatas (Geographic atau UTM). Tapi bagaimana jika yang disimpan di Database hanya salah satu metode koordinat diatas (Misal UTM), kemudian anda ingin mengkonversi ke Geographic  ataupun sebaliknya. Ikutilah langkah-langkah berikut:

1. Download .Net Assembly yang kami buat disini.  (Jika ingin lengkap dengan Source Code nya disini  dengan Bahasa VB .Net)

 

2. Buka SQL Server 2008 anda, login dan Buat Database Baru bernama SPATIAL.

3. Buatlah Kueri baru untuk membuat Assembly  dan Function di SQL Server 2008. Berikut ini Kuerinya. (Sesuaikan Path dari ClassMap.dll yang anda download diatas)

exec sp_configure 'clr enabled','1'
go
alter database SPATIAL set trustworthy on
go
CREATE ASSEMBLY [myConverter]
FROM 'D:\ClassMap.dll'  
WITH PERMISSION_SET = EXTERNAL_ACCESS;
GO 
 
 
 
 
CREATE FUNCTION [dbo].[ConvertToLonLat](@strInputan [nvarchar](max), @Zone [float], @Southemi [int])
RETURNS [nvarchar](max) WITH EXECUTE AS CALLER
AS 
EXTERNAL NAME [myConverter].[ClassMap.clsMAP].[ConvertToLonLat]
GO
 
 
CREATE FUNCTION [dbo].ConvertToUTM(@strInputan [nvarchar](max))
RETURNS [nvarchar](max) WITH EXECUTE AS CALLER
AS 
EXTERNAL NAME [myConverter].[ClassMap.clsMAP].ConvertToUTM
GO
 
CREATE FUNCTION [dbo].getZone(@strInputan [nvarchar](max))
RETURNS [nvarchar](5) WITH EXECUTE AS CALLER
AS 
EXTERNAL NAME [myConverter].[ClassMap.clsMAP].getZone
GO

Hasil dari Pembuatan Assembly tersebut (Buka TreeView Assembly dan Function di SQL Server 2008) :

Hasil

4. Buatlah Kueri baru untuk membuat Tabel ContohSpatial dan mengisi datanya seperti berikut.

create table ContohSpatial
( 
  NamaTempat varchar(50),
  Lokasi geometry
 )
  
Insert Into ContohSpatial 
Values ('Gedung S. Suriansyah Banjarmasin',
geometry::STGeomFromText('POINT(232221.715513239 9635028.93805386)',4326))
       
Insert Into ContohSpatial 
Values ('Gedung di BJM',
geometry::STGeomFromText('POLYGON ((234513.73966272507 9631784.7328673452, 
234529.49938104203 9631773.91853934, 234534.20553610422 9631780.8087223079, 
234518.43700368819 9631791.6325512715, 234513.73966272507 9631784.7328673452))',4326))

 

5. Buka Browser anda ketikkan halaman http://maps.google.com/ kemudian ketikkan Inputan disebelah Tombol Search Maps Koordinat yang sama seperti data yang kita masukkan dinomor 4 tadi yaitu posisi Gedung Sultan Suriansyah di Banjarmasin. Posisinya adalah 232221.715513239 9635028.93805386    (ketikkan kemudian tekan tombol Search Maps) maka hasilnya tidak dapat ditemukan karna posisinya masih dalam UTM seperti berikut ini.

UTM

6. Untuk mengkonversi posisi UTM tersebut ke Geographic maka gunakan function ConvertToLonLat(…., …. , ….)  yang kita buat diatas tadi seperti berikut ini :

Select 
Lokasi.STAsText() as LokasiUTM,
dbo.ConvertToLonLat(Lokasi.STAsText(),50,1) as LokasiLonLat
From ContohSpatial

Hasil Kolom Pertama adalah Posisi UTM dan Kolom Kedua adalah Posisi Geographic : Konversi ke Geographic ialah posisi : POINT (-3.29903799999901 114.590287000032)

Konversi

Catatan : Function ConvertToLonLat memiliki 3 Parameter (Posisi, Zona, isSouth)Karna Banjarmasin berada di Zona 50 S maka pemanggilannya dengan dbo.ConvertToLonLat(Lokasi.STAsText(), 50 ,1) as LokasiLonLat

1 = Selatan , 0 = Utara

Kita coba masukkan posisi  -3.29903799999901 114.590287000032 ke Google Maps maka posisi Gedung Sultan Suriansyah di Banjarmasin akan tampil sebagai berikut :

GedungSS

7. Untuk mengembalikan dari Geographic ke UTM gunakan function ConvertToUTM () dan Jika ingin mengetahui Zonanya gunakan function  getZone () seperti berikut ini :

Select dbo.ConvertToUTM('POINT (-3.29903799999901 114.590287000032)') as LokasiUTM
Select dbo.getZone('POINT (-3.29903799999901 114.590287000032)') as Zona

 

 

 

 

Hasilnya :

Hasil2

Catatan :

  • Function ConvertToUTM dan getZone memiliki 1 Parameter yaitu Text dari Posisi Longitude dan Latitude.
  • Semua function diatas menggunakan model Ellipsoid WGS 84

8. Semoga Bermanfaat dan Terima Kasih :)

Share this post: | | | |
Seminar sehari bersama MUGI Banjarmasin di Kampus STMIK Banjarbaru

Pada hari sabtu tanggal 10 April 2010 ini, Anggota MUGI Banjarmasin yaitu Suherman MVP dan saya sendiri Ferry Kurniawan bekerjasama dengan STMIK Banjarbaru  mengadakan seminar tentang Update Teknologi MICROSOFT. Acara ini bertujuan untuk memperkenalkan tentang teknologi Microsoft yaitu SQL Server 2008 dan Visual Studio .net. Acara ini dimulai dari pukul 09:00 Wita dan berakhir sekitar pukul 17:00 Wita. Yang menjadi suatu kehormatan bagi kami adalah para peserta dari seminar ini adalah para Dosen STMIK Banjarbaru. Materi yang disampaikan adalah :

  1. Spatial Data menggunakan SQL Server 2008 oleh Suherman MVP
  2. Perkenalan MUGI oleh Suherman MVP
  3. Web Application menggunakan ASP .Net oleh saya sendiri Ferry Kurniawan (Menggantikan Mas Reza Faisal yang berhalangan hadir)
  4. Windows Mobile Application oleh saya sendiri : Ferry Kurniawan.

Kami dari anggota MUGI Banjarmasin mengucapkan terima kasih sedalam-dalamnya kepada Dosen-dosen dan Seluruh Karyawan STMIK Banjarbaru yang telah menerima dan menjamu kami dengan sangat ramah. Tak lupa kami sampaikan terima kasih sebesar-besarnya kepada mas narenda dan mas ronald atas atensi, dukungan dan kiriman DVD nya :) , Terima kasih juga kepada rekan-rekan komunitas lainnya :)

Berikut ini dokumentasi dari acara tersebut :

IMGP0153  IMGP0161

IMGP0170  IMGP0164 IMGP0169

IMGP0183  IMGP0182

Share this post: | | | |
Menampilkan Data Spatial SQL Server 2008 Menggunakan “Web Mapping Services”

Pengertian Data Spatial menurut wikipedia  adalah data yang memiliki referensi ruang kebumian (georeference) dimana berbagai data atribut terletak dalam berbagai unit spasial. Sekarang ini data spasial menjadi media penting untuk perencanaan pembangunan dan pengelolaan sumber daya alam yang berkelanjutan pada cakupan wilayah continental, nasional, regional maupun lokal.  Untuk itulah Microsoft SQL Server 2008 diluncurkan untuk mendukung data spatial dengan tambahan tipe data geography dan geometry – nya. Pada kesempatan kali ini kami akan memberikan sedikit contoh untuk menampilkan data spatial dengan menggunakan “Web Mapping Service”  (Application Programming Interfaces) yang disediakan oleh Bing Maps ataupun Google Maps.

Pada kasus berikut ini kami akan mencontohkan menampilkan data spatial tentang “Lokasi Gempa yang ada di Negara USA dalam kurun waktu 7 hari terakhir” . Berikut ini langkah-langkahnya :

1. Buka Browser anda kemudian ketikkan url berikut ini : http://earthquake.usgs.gov/earthquakes/catalogs/eqs7day-M1.txt     link tersebut memuat dataset berupa file text yang memberikan informasi gempa yang terjadi di USA dalam kurun waktu 7 hari terakhir.

1

2. Dari Browser anda pilih File –> Save As. Kemudian simpan di C:\gempa.txt

3. Buka SQL Server 2008 anda kemudian buat Database Baru dengan nama GEMPA.

2

4. Dari database Gempa kemudian Klik Kanan –> Task –> Import Data. Kemudian akan tampil Jendela Import and Export Wizard. Klik Next

5. Pilih Data Source ke Flat File Source. Klik tombol Browse kemudian cari File C:\gempa.txt tadi.

6.  Setting Text Qualifier menjadi tanda petik dua ().

7. Centang check box Column Names in the First Data Row.

8. Klik Option Advance Kemudian Setting masing-masing Column Properties seperti Berikut ini :   

Name DataType OutputColumnWidth
Src string [DT_STR] 2
Eqid string [DT_STR] 8
Version string [DT_STR] 1
Datetime string [DT_STR] 50
Lat double-precision float [DT_R8]  
Lon double-precision float [DT_R8]  
Magnitude float [DT_R4]  
Depth float [DT_R4]  
NST two-byte signed integer [DT_I2]
 
Region string [DT_STR] 255

9. Setelah itu klik Next, Maka akan tampil jendela Choose Destination pilih Database Gempa yang tadi kita buat kemudian tekan Next. Pilih tabel tujuan nya dengan nama gempa. Klik Finish maka data file C:\gempa.txt tadi diekspor menjadi tabel gempa di database Gempa. Kemudian tampilkan data di tabel gempa tersebut maka akan tampil seperti berikut :

3 4

catatan :

- Data gempa yang anda coba kemungkinan akan berubah-ubah terus dikarnakan data yang diinformasikan hanya dalam kurun waktu 7 hari terakhir.

- Kolom Lat & Lon adalah posisi terjadinya gempa.

10. Buka SQL Server 2008 anda kemudian ketikkan kueri untuk menambahkan kolom location yang bertipe geography. Kemudian Update kolom location tersebut dengan kueri seperti berikut :

alter table gempa
add location geography
  
update  gempa
set location = geography::Point(lat,lon,4326)
11. Buat Stored Procedure untuk menampilkan informasi terjadinya gempa seperti berikut ini.
Create PROCEDURE [dbo].LokasiGempa
@latitude float,
@longitude float
AS
BEGIN
 
DECLARE @Point geography
SET @Point = geography::Point(@latitude, @longitude, 4326)
 
DECLARE @SearchArea geography
SET @SearchArea = @Point.BufferWithTolerance(50000,1000,0)
 
SELECT
location.STGeometryType() AS GeometryType,
location.STAsText() AS WKT,
'Lokasi Gempa : ' + eqid as Title,
'Wilayah : ' + REGION + '<br/>' +
'Tanggal :' + [Datetime] + '<br/>' 
AS Description
FROM
gempa 
WHERE
location.STIntersects(@SearchArea) = 1
 
UNION ALL SELECT
@SearchArea.STGeometryType() AS GeometryType,
@SearchArea.STAsText() AS WKT,
'Lokasi Gempa ' as Title,
'Lokasi gempa yang terdekat  sejarak 50 km' AS Description
END

12. Buka Visual Studio anda kemudian buat New Website. Beri nama GempaUSA. (Disini kami menggunakan Visual Basic)

13. Tambahkan sebuah Generic Handler dengan cara Klik Kanan –> Add New Item –> Generric Handler. Simpan dengan nama Handler.ashx   di handler ini tambahkan code untuk menampilkan data Lokasi Gempa.

<%@ WebHandler Language="VB" Class="Handler" %>
Imports System
Imports System.Web
Imports System.Data.SqlClient
Imports System.Configuration
Imports System.Text
Public Class Handler : Implements IHttpHandler
  Public Sub ProcessRequest(ByVal context As HttpContext) _
  Implements IHttpHandler.ProcessRequest
    'Declare the global script variables
    Dim Output As String = "" 'The JavaScript response sent back to the Map API
    Dim MapType As String = context.Request.Params("maptype") 'API to use (VE/GM)
    'Declare the variables used to create each feature
    Dim WKT As String = "" 'The WKT representation provided by the stored proc
    Dim VEGM As String = "" 'The VE/GMaps equivalent representation
    Dim Shape As String = "" 'The unique name of each shape
    Dim ShapeTitle As String = "" 'The title to display for each shape
    Dim ShapeDescription As String = "" 'The description attached to the shape
    Dim id As Integer = 0 'Shape counter
    Dim LineStyle As String = "" 'The line style
    Dim FillStyle As String = "" 'The fill style
    'Set up a connection to SQL server
        Dim myConn As SqlConnection = New SqlConnection("server=PDI-APP-LAPTOP\Mobile;" & _
          "Trusted_Connection=yes;" & _
          "database=GEMPA")
    'Open the connection
    myConn.Open()
    'Define the stored procedure to execute
        Dim myQuery As String = "dbo.LokasiGempa"
    Dim cmd As New SqlCommand(myQuery, myConn)
    cmd.CommandType = Data.CommandType.StoredProcedure
    'Send the point the user clicked on to the stored proc
    cmd.Parameters.Add("@Latitude", Data.SqlDbType.Float)
    cmd.Parameters("@Latitude").Value = context.Request.Params("lat")
    cmd.Parameters.Add("@Longitude", Data.SqlDbType.Float)
    cmd.Parameters("@Longitude").Value = context.Request.Params("long")
    'Create a reader for the result set
    Dim rdr As SqlDataReader = cmd.ExecuteReader()
    'Go through the results
    While rdr.Read()
      'Set a unique variable name for this shape
      Shape = "shape" + id.ToString
      'Set the title for the shape
      ShapeTitle = rdr("Title").ToString
      'Set the description for the shape
      ShapeDescription = rdr("Description").ToString
      'Set the appropriate styling options for each shape
      
        
            'Set the color and opacity for fills
            FillStyle = 'new VEColor(0, 0, 255, 0.5)'
            'Set the color and opacity for lines
            LineStyle = 'new VEColor(255, 255, 255, 0.7)"
 
            'Convert from WKT to the relevant API constructor for the type of geometry
            Select Case rdr("GeometryType").ToString
                Case "Point"
                    'Get the WKT representation of the object
                    WKT = rdr("WKT").ToString
                    'Replace the double brackets that surround the coordinate point pair
                    WKT = Replace(WKT, "POINT (", "")
                    'Remove the closing double brackets
                    WKT = Replace(WKT, ")", "")
                    'Build the appropriate Pushpin/GMarker object from the coordinates
                    VEGM = ""
                    Dim Coords() As String = Split(Trim(WKT), " ")
                    
                    VEGM = VEGM + "new VELatLong(" + Coords(1) + "," + Coords(0) + ")"
                    Output += "var " + Shape + _
                    "=new VEShape(VEShapeType.Pushpin, " + VEGM + ");"
                    
                    'Display descriptive airport information when mouse hovers over point
                    
                    'Set the shape title
                    Output += Shape + ".SetTitle('" + ShapeTitle + "');"
                    'Set the shape description
                    Output += Shape + ".SetDescription('" + ShapeDescription + "');"
          
                Case "Polygon"
                    'Get the WKT representation of the object
                    WKT = rdr("WKT").ToString
                    'Replace the double brackets that surround the coordinate point pairs
                    WKT = Replace(WKT, "POLYGON ((", "")
                    'Remove the closing double brackets
                    WKT = Replace(WKT, "))", "")
                    'Create an array of each point in the Polygon
                    Dim PointArray() As String = Split(WKT, ",")
                    'Build the appropriate VE/GMaps Polygon object from the coordinates
                    VEGM = ""
                    Dim i As Integer = 0
                    While i <= PointArray.Length - 1
                        Dim Coords() As String = Split(Trim(PointArray(i)), " ")
                        
                        VEGM = VEGM + "new VELatLong(" + Coords(1) + "," + Coords(0) + "),"
                        i = i + 1
                    End While
                    'Remove the last trailing comma
                    VEGM = Left(VEGM, VEGM.Length - 1)
                    'Add the constructor for the Polygon, and apply styling options
                  
                    Output += "var " + Shape + _
                    "=new VEShape(VEShapeType.Polygon, [" + VEGM + "]);"
                    Output += Shape + ".SetLineColor(" + LineStyle + ");"
                    Output += Shape + ".SetFillColor(" + FillStyle + ");"
                    Output += Shape + ".HideIcon();"
                   
            End Select
            'Add the shape to the map
           
            Output += "map.AddShape(" + Shape + ");"
           
            'Increment the shape counter
            id = id + 1
        End While
    'Close the reader
    rdr.Close()
    'Close the connection
    myConn.Close()
    'Tell the browser to handle the response as JavaScript
    context.Response.ContentType = "text/JavaScript"
    'Do not cache the results, so always load new data
    context.Response.CacheControl = "no-cache"
    'Make the response expire immediately
    context.Response.Expires = -1
    'Return the constructed JavaScript
    context.Response.Write(Output)
  End Sub
  ReadOnly Property IsReusable() As Boolean Implements IHttpHandler.IsReusable
    Get
      Return False
    End Get
  End Property
End Class

 

 

 

 

 

13. Tambahkan sebuah JScript File dengan cara Klik Kanan –> Add New Item –> Jscript File. Simpan dengan nama JScript.js  di dalam JScript ini terdapat function-function yang digunakan untuk mengakses API dari Bing Maps  dan terhubung dengan Handler yang kita buat sebelumnya.

// Declare the global map object
var map = null;
 
// Set the Load callback
if (window.addEventListener) { window.addEventListener("load", getMap, false); }
else if (window.attachEvent) { window.attachEvent("onload", getMap); }
 
// Set the unLoad callback
if (window.addEventListener) { window.addEventListener("unload", disposeMap, false); }
else if (window.attachEvent) { window.attachEvent("onunload", disposeMap); }
 
// This function is called when the page has been loaded
function getMap() {
 
  // Create a new map object in the divMap container
  map = new VEMap('divMap');
 
  // Configure the initial map view  
  map.LoadMap(new VELatLong(34, -118), 8, VEMapStyle.Aerial);
  
 
 
  // Call the loadAirportData function when the user clicks the map
  map.AttachEvent("onclick", loadAirportData);
}
 
// This function creates a cross-browser AJAX object
function GetXmlHttp() {
  var xmlHttp;
  try { xmlHttp = new XMLHttpRequest(); } // Firefox, Opera 8.0+, Safari
  catch (e) {
    try { xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); } // IE 6.0+
    catch (e) {
      try { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } // Older IE
      catch (e) {
        alert("Your browser does not support AJAX!");
        return false;
      }
    }
  }
  return xmlHttp;
}
 
 
 
 
function loadAirportData(e) {
 
  // Clear the map
  map.DeleteAllShapes();
 
  // Convert the cursor location to latitude / longitude
  var pos = map.PixelToLatLong(new VEPixel(e.mapX, e.mapY));
 
  //Get the appropriate XMLHTTP object for the browser
  var xmlhttp = GetXmlHttp();
 
  // If we have a valid XMLHTTP object
  if (xmlhttp) {
    // Define the url of the handler
    var url = "./Handler.ashx";
    // Build the parameters that must be passed
    var params = "lat=" + pos.Latitude + "&long=" + pos.Longitude + "&maptype=VE";
    // Open the XmlHTTP request
    xmlhttp.open("GET", url + '?' + params, true);
    // Fire this when the readyState of the request changes
    xmlhttp.onreadystatechange = function() {
      // readystate 4 indicates that the request is complete  
      if (xmlhttp.readyState == 4) {
        // Read in the JavaScript response from the handler
        var result = xmlhttp.responseText;
        // Update the status message
        window.status = 'Loading Data...';
        try {
          // Execute the dynamically created JavaScript
          eval(result);
          // Update the status message
          window.status = 'Data Loaded!';
        }
        catch (e) {
          // If the response cannot be evaluated
          window.status = 'Data could not be loaded.';
        }
      }
    }
    // Send the XMLHttp Request
    xmlhttp.send(null);
  }
}
 
// This function is called when the page is unloaded
function disposeMap() {
 
  // Release all resources assigned to the map
  map.Dispose();
 
  // Unset the map variable
  map = null;
}

14. Buka file Default.aspx kemudian klik source nya kemudian tambahkan code seperti berikut ini.

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Data Spatial Lokasi Gempa di USA</title>
    <script src="http://dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6.2" type="text/JavaScript"></script>
    <script src="JScript.js" type="text/JavaScript"></script>
</head>
<body>
    <div id="divMap" style='position:relative; width:800px; height:600px;"></div>
</body>
</html>

15.  Jalankan Defaut.aspx tersebut (harus terhubung dengan internet). Kemudian akan tampil Bing  Maps yang menampilkan peta USA. Klik di peta tersebut sampai ada tanda merah (lokasi gempa) , kemudian dekati mouse maka akan tampil Informasinya.

5

16. Dowload Source Code –nya disini.

17. Selamat Mencoba , Semoga Bermanfaat dan Terima Kasih :)

Share this post: | | | |
Siaqodb sebagai Alternatif “Storing Data” di Windows Phone 7

Windows Phone 7 telah diluncurkan oleh Microsoft beberapa waktu yang lalu, untuk pengembangan aplikasi di Windows Phone 7 ini anda diberikan dua pilihan framework yaitu Silverlight atau XNA Framework. Timbul pertanyaan dari saya untuk teknik penyimpanan local database di Windows Phone 7 ini bagaimana caranya? Setelah beberapa saat mencari referensi akhirnya ketemu juga solusi alternatifnya yaitu Siaqodb. Apa itu Siaqodb dan bagaimana cara mengembangkannya anda dapat menuju ke TKP berikut ini. Berikut ini gambar contoh Siaqodb di Windows Phone 7. Bagi ada solusi lainnya mohon kiranya di posting di Blog, Terima Kasih & Semoga Bermanfaat :)

SiaqodbWP7

Share this post: | | | |
Report Event : Kuliah Umum “Membangun Web Dinamis Menggunakan ASP .Net” di STMIK Banjarbaru

Setelah minggu lalu Pak Suherman Ketua MUGI Banjarmasin bertandang ke Universitas Lambung Mangkurat untuk berbagi pengalaman tentang SQL Server 2008 disini, maka pada kesempatan hari  ini tanggal 20 Maret 2010 saya ikut pula berbagi pengalaman di Kampus STMIK Banjarbaru. Materi yang saya bawakan bertajuk “Membangun Web Dinamis Menggunakan ASP .Net” dengan peserta kurang lebih 40 mahasiswa dimana acara ini berlangsung selama 2,5 jam.Terima Kasih ktak lupa kami ucapkan kepada seluruh jajaran dosen dan petinggi STMIK Banjarbaru yang telah memberikan waktu dan tempatnya.

Untuk selanjutnya minggu depan tepatnya tanggal 27 Maret di tempat yang sama, InsyaAllah akan diadakan lagi kuliah umum dengan judul “Membangun Aplikasi Berbasis Windows  Mobile menggunakan Visual Studio .Net”. Untuk selanjutnya acara kuliah umum ini direncanakan nantinya akan dipresentasikan di hadapan para Dosen dan akan mengundang pembicara lainnya seperti Pak Reza Faisal dan Pak Suherman dari MUGI Banjarmasin. Mohon doa dan dukungan rekan-rekan komunitas semoga acara yang direncanakan nantinya dapat segera terwujud dan berjalan dengan lancar :) Amin. Berikut ini dokumentasi dari acara Kuliah Umum “Membangun Web Dinamis Menggunakan ASP .Net” :

IMGP0072  IMGP0085

 IMGP0091   IMGP0077

IMGP0118  IMGP0095

Share this post: | | | |
Monitoring The Battery Level in Windows Mobile

Sejak Windows Mobile 5 diluncurkan, .Net Compact Framework melucurkan pula sebuah API (Application Programming Interface) yang digunakan untuk “Meng-Query” Setting dari Device beserta event-event di dalamnya ketika settingan tersebut ikut berubah. API tersebut dikenal dengan nama State & Notification Broker yang sangat bermanfaat untuk mengakses properties dari Sistem. Salah satunya penggunaan API tersebut adalah untuk mengetahui Level Power Baterai dari Alat (Low, High, Medium dll). Berikut ini contoh penggunaannya :

1. Buat project SmartDevice baru di Visual Studio 2008. (disini kami menggunakan VB .Net)

2. Tambahkan 3 buah control berikut ke dalam form.

  • Label , Name = Label1, Text = Battery Level
  • Progress Bar, Name = pbLevel
  • Label, Name = lblStatus, Text = Status :    

1

3. Add NameSpace Microsoft.WindowsMobile & Microsoft.WindowsMobile.Status ke dalam project anda.

4. Buka form1.vb kemudian tambahkan code dibawah ini. Pada code dibawah ini kita membuat sebuah SystemState yang bernama BatteryPower yang digunakan untuk menangkap Power Baterai dari Device, kemudian tambahkan sebuah Handler  yang digunakan untuk menangkap perubahan Power Baterai dari Device dan kemudian ditampilkan di Progress Bar pbLevel melalui Prosedur CekBatteryPower.

 

 
Imports Microsoft.WindowsMobile
Imports Microsoft.WindowsMobile.Status
 
Public Class Form1
    Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
        Dim BatteryPower As SystemState
        BatteryPower = New SystemState(SystemProperty.PowerBatteryStrength)
        AddHandler BatteryPower.Changed, AddressOf BatteryPower_Changed
        CekBatteryPower(SystemState.PowerBatteryStrength)
    End Sub
    Private Sub CekBatteryPower(ByVal levelBatt As BatteryLevel)
        Select Case levelBatt
            Case BatteryLevel.VeryHigh
                lblStatus.Text = "Status : Very High"
                pbLevel.Value = 100
            Case BatteryLevel.High
                lblStatus.Text = "Status : High"
                pbLevel.Value = 75
            Case BatteryLevel.Medium
                lblStatus.Text = "Status : Medium"
                pbLevel.Value = 50
            Case BatteryLevel.Low
                lblStatus.Text = "Status : Low"
                pbLevel.Value = 25
            Case BatteryLevel.VeryLow
                lblStatus.Text = "Status : Very Low"
                pbLevel.Value = 0
        End Select
    End Sub
    Private Sub BatteryPower_Changed(ByVal sender As Object, ByVal args As ChangeEventArgs)
        CekBatteryPower(DirectCast(args.NewValue, BatteryLevel))
    End Sub
 
End Class

5. Jalankan project tersebut maka akan tampil PowerBaterai dari Device tersebut.

2

6. Selamat Mencoba, Semoga Bermanfaat & Terima Kasih :)

Share this post: | | | |
More Posts Next page »