<UserControl x:Class="GoogleMap.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
xmlns:esri="http://schemas.esri.com/arcgis/client/2009"
xmlns:controlsToolkit="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Toolkit"
xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk"
xmlns:layer="clr-namespace:GoogleMap.CommonClass"
d:DesignHeight="300" d:DesignWidth="400" Loaded="UserControl_Loaded">
<Grid x:Name="LayoutRoot" Background="White">
<esri:Map x:Name="myMap" IsLogoVisible="False" ZoomDuration="0:00:02" PanDuration="0:00:02">
</esri:Map>
</Grid>
</UserControl>
3、Silverlight專案中的MainPage.xaml.cs檔案內容如下:
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 TestDZX.CommonClass;
using ESRI.ArcGIS.Client.Geometry;
using ESRI.ArcGIS.Client;
namespace GoogleMap
{
public partial class MainPage: UserControl
{
ESRI.ArcGIS.Client.Projection.WebMercator mercator = new ESRI.ArcGIS.Client.Projection.WebMercator();
public MainPage()
{
InitializeComponent();
}
private void UserControl_Loaded(object sender, RoutedEventArgs e)
{
GoogleTopographicLayerlayer = new GoogleTopographicLayer();
myMap.Layers.Add(layer);
}
}
}
4、完成以上步驟後,執行,可以看見Google地形圖了,just try it,have fun!
5、補充:這裡使用的是墨卡託座標,而我們經常使用的是經緯度座標,這就需要做轉換,下面提供一個類,WKIDConvert.cs,內容
如下:
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;
using ESRI.ArcGIS.Client.Geometry;
namespace GoogleMap.CommonClass
{
public static class WKIDConvert
{
//經緯度轉墨卡託
public static MapPoint lonlat2mercator(MapPoint lonlat)
{
MapPoint mercator = new MapPoint();
double X = lonlat.X * 20037508.34 / 180;
double Y = Math.Log(Math.Tan((90 + lonlat.Y) * Math.PI / 360)) / (Math.PI / 180);
Y = Y * 20037508.34 / 180;
mercator.X = X;
mercator.Y = Y;
return mercator;
}
//墨卡託轉經緯度
public static MapPoint mercator2lonlat(MapPoint mercator)
{
MapPoint lonlat = new MapPoint();
double X = mercator.X / 20037508.34 * 180;
double Y = mercator.Y / 20037508.34 * 180;
Y = 180 / Math.PI * (2 * Math.Atan(Math.Exp(Y * Math.PI / 180)) - Math.PI / 2);
lonlat.X = X;
lonlat.Y = Y;
return lonlat;
}
}
}
然後我們如果要定位到某個城市的話,比如黃山市,其Extent為:117.647738815324,29.4704217183843,118.446182957997,30.4124245048916
我們這裡為MainPage.xaml.cs中新增一行程式碼即可定位到黃山市範圍
private void UserControl_Loaded(object sender, RoutedEventArgs e)
{
GoogleTopographicLayer layer = new GoogleTopographicLayer();
myMap.Layers.Add(layer);
myMap.Extent = new Envelope(WKIDConvert.lonlat2mercator(new MapPoint(117.647738815324, 29.4704217183843)), WKIDConvert.lonlat2mercator(new MapPoint(118.446182957997, 30.4124245048916)));
}
6、再次補充:在之前的Google地形圖上疊加自定義ArcMap地圖,可以是動態圖也可以是靜態圖,只要加上釋出的地圖,即可顯示,在MainPage.xaml.cs中新增如下幾行程式碼即可。
private void UserControl_Loaded(object sender, RoutedEventArgs e)
{
//疊加Google地形圖瓦片
GoogleTopographicLayer layer = new GoogleTopographicLayer();
myMap.Layers.Add(layer);
layer.Opacity = 1;
//載入動態圖
ESRI.ArcGIS.Client.ArcGISDynamicMapServiceLayer dLayer = new ESRI.ArcGIS.Client.ArcGISDynamicMapServiceLayer();
myMap.Layers.LayersInitialized += (evtsender, args) =>
{
myMap.ZoomTo(dLayer.InitialExtent);
};
dLayer.Url = "http://localhost/arcgis/rest/services/HS/MapServer/";
myMap.Layers.Add(dLayer);
dLayer.Opacity = 1;
myMap.Extent = new Envelope(WKIDConvert.lonlat2mercator(new MapPoint(117.647738815324, 29.4704217183843)), WKIDConvert.lonlat2mercator(new MapPoint(118.446182957997, 30.4124245048916)));
}
效果圖如下,這裡只是做了黃山市的市界邊線,主要作用就是在Google地形圖上明顯看出黃山市的範圍: