Использование картографического сервиса (Silverlight)

Дополнительные материалы к занятию можно скачать здесь.

Компания Environment Studies Research Institute (ESRI) является одним из лидеров в области разработки ГИС-приложений. Не так давно началось взаимное проникновение технологий ESRI и Microsoft. Это выразилось, в частности, в разработке продукта ArcGIS API for WPF/Silverlight. Благодаря этому подходу у программистов, использующих Silverlight, получить доступ к картографическим сервисам ESRI. Встречное движение предприняла и Microsoft. В частности в SQL Server 2008 появились столбцы типа Geometry и Geography, с помощью которых можно описывать объекты, имеющие географическую привязку.

Для выполнения данной работы потребуется скачать и установить ARCGIS API for Silverlight с сайта компании ESRI (http://www.esri.com)

Упражнение 28.1. Разработка простого картографического приложения (Silverlight)

Запускаем Visual Studio 2010. Создаем приложение Silverlight p20_1

Выбираем все действия по умолчанию

Далее, нам нужно добавить ссылку на библиотеку ESRI.ArcGIS.Client.dll

Затем добавляем ссылку на эту библиотеку в xaml-заголовке:

xmlns:esri="http://schemas.esri.com/arcgis/client/2009"
    

Затем добавляем карту:

        <esri:Map>
            <esri:Map.Layers>
                <esri:ArcGISTiledMapServiceLayer ID="BaseLayer"
                Url="http://services.arcgisonline.com/ArcGIS/rest/services/World_street_Map/MapServer">
                </esri:ArcGISTiledMapServiceLayer>
            </esri:Map.Layers>
        </esri:Map>
    

Полный листинг xaml-документа:

<UserControl x:Class="p20_1.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"         
    d:DesignHeight="300" d:DesignWidth="400">

    <Grid x:Name="LayoutRoot" Background="White">
        <esri:Map>
            <esri:Map.Layers>
                <esri:ArcGISTiledMapServiceLayer ID="BaseLayer" 
                Url="http://services.arcgisonline.com/ArcGIS/rest/services/World_street_Map/MapServer">
                </esri:ArcGISTiledMapServiceLayer>
            </esri:Map.Layers>
        </esri:Map>

    </Grid>
</UserControl>
    

Результат:

С помощью колеса прокрутки мыши карту можно масштабировать:

Упражнение 28.2. Карта с государственными границами

В данной работе мы создадим более сложную карту. Изначально на ней показаны государственные границы, при увеличении масштаба также становится виден рельеф местности.

Создаем приложение Silverlight p20_2. Повторяем действия из предыдущего упражнения.

Код xaml:

<UserControl x:Class="p20_2.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"
    d:DesignHeight="300" d:DesignWidth="400">

    <Grid x:Name="LayoutRoot" >

        <esri:Map x:Name="MyMap">
            <esri:ArcGISTiledMapServiceLayer ID="MyLayer" 
                Url="http://services.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap_World_2D/MapServer" />
        </esri:Map>

    </Grid>

</UserControl>
    

Результат:

Упражнение 28.3. Создание динамических слоев

Создаем проект Silverlight p20_3. Повторяем действия из предыдущего упражнения.

Код xaml:

<UserControl x:Class="p20_3.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"
    d:DesignHeight="300" d:DesignWidth="400">

    <Grid x:Name="LayoutRoot" Background="White" >

        <esri:Map x:Name="MyMap" >
            <esri:ArcGISDynamicMapServiceLayer ID="MyLayer"
                Url="http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StateCityHighway_USA/MapServer" />
        </esri:Map>

    </Grid>

</UserControl>
    

Результат:

Упражнение 28.4. Динамические и Плиточные Слои

Создаем проект Silverlight p20_4. Повторяем действия из предыдущего упражнения.

Код xaml:

<UserControl x:Class="p20_4.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"
    d:DesignHeight="300" d:DesignWidth="400">

    <Grid x:Name="LayoutRoot" >

        <esri:Map x:Name="MyMap" Extent="-120,20,-90,60">
            <esri:ArcGISTiledMapServiceLayer ID="StreetMapLayer" 
                Url="http://services.arcgisonline.com/ArcGIS/rest/services/ESRI_ShadedRelief_World_2D/MapServer"/>
            <esri:ArcGISDynamicMapServiceLayer ID="DynamicLayer" Opacity="0.6" 
                Url="http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StateCityHighway_USA/MapServer"/>
        </esri:Map>

    </Grid>

</UserControl>
    

Результат:

Упражнение 28.5. Список слоев

В данном приложении пользователь может также, как в программе ArcGIS, активизировать слои.

Создаем проект Silverlight p20_5. Повторяем действия из предыдущего упражнения.

Код xaml:

<UserControl x:Class="p20_5.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"
    d:DesignHeight="300" d:DesignWidth="400">

    <Grid x:Name="LayoutRoot" >

        <esri:Map x:Name="MyMap" Extent="-120,20,-90,60">
            <esri:ArcGISTiledMapServiceLayer ID="Street Map" 
                    Url="http://services.arcgisonline.com/ArcGIS/rest/services/ESRI_ShadedRelief_World_2D/MapServer"/>
            <esri:ArcGISDynamicMapServiceLayer ID="State,City,Highway" Opacity="0.6" 
                    Url="http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Specialty/ESRI_StateCityHighway_USA/MapServer"/>
            <esri:ArcGISDynamicMapServiceLayer ID="California" Opacity="0.4"
                    Url="http://serverapps.esri.com/ArcGIS/rest/services/California/MapServer" />
        </esri:Map>

        <Border Background="#995C90B2" BorderThickness="1" CornerRadius="5"
            HorizontalAlignment="Right"  VerticalAlignment="Top"
            Margin="20" Padding="5" BorderBrush="Black" >
            <ListBox x:Name="MyList" ItemsSource="{Binding ElementName=MyMap, Path=Layers}" Margin="3">
                <ListBox.ItemTemplate>
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal" Margin="2">
                            <!--Layer visibility checkbox-->
                            <CheckBox IsChecked="{Binding Visible, Mode=TwoWay}" />
                            <!--Opacity slider-->
                            <Slider Minimum="0" Maximum="1" Width="30" 
                                Value="{Binding Opacity, Mode=TwoWay}" Height="22" />
                            <!--Layer name-->
                            <TextBlock Text="{Binding ID, Mode=OneWay}" Margin="5,0,2,0" > 
                            <!-- Tooltip on hover-->
                                <ToolTipService.ToolTip>
                                    <StackPanel MaxWidth="400">
                                        <TextBlock FontWeight="Bold" Text="{Binding CopyrightText}" TextWrapping="Wrap" />
                                        <TextBlock Text="{Binding Description}" TextWrapping="Wrap" />
                                    </StackPanel>
                                </ToolTipService.ToolTip>
                            </TextBlock>
                        </StackPanel>
                    </DataTemplate>
                </ListBox.ItemTemplate>
            </ListBox>
        </Border>

    </Grid>

</UserControl>
    

Результат: