Работа с Bing Maps для Sharepoint Server 2010

  • Article

Про API функции bing maps я хочу чуток детальнее рассказать.

image

Приложение, отображающее карту будем писать на SilverLight, так как весь bing maps построен на этой технологии. Для начала нужно быть зарегистрированным на сайте bing.com/maps. Он совместим с учётными данными LiveID, так что можно использовать их для регистрации. После регистрации необходимо получить ключ для Вашего Веб сайта. Для того, чтобы получить этот ключ, нужно зайти по ссылке - https://www.bingmapsportal.com/application и указать название Вашего веб узла и сам адрес веб узла. После необходимо нажать кнопку “Создать ключ”

image

 

После того, как Вы получили ключ, необходимо скачать библиотеки работы с API функциями bing maps. Скачать можно отсюда - https://www.microsoft.com/downloads/details.aspx?displaylang=en&familyid=beb29d27-6f0c-494f-b028-1e0e3187e830.

Конечно после того, как скачаете, не забудьте установить скачанное :). Далее запускаем Visual Studio 2010 (2008) и создаём проект SilverLight Application.

image

Далее подключаем к нашему проекту две библиотеки Bing Silverlight Map Control

image 

Далее указываем пространство имён, необходимое нам.

3.gif

И после создаём объект карты, где указываем наш сгенерированный ключ.

Примечание – Карта полноценно будет работать только на Вашем веб сайте, который Вы указывали при получении ключа.

4.gif

 

 

 

При запуске мы получим карту

5.gif

Но теперь нам необходимо получить определённой место на карте. Для этого используем класс Location

Открываем наш C# код в котором пишем:

           Location center = new Location(50.442133, 30.5);
myMap.SetView(center, 14);

После компиляции, автоматически будет отображено наше место на карте по нашим указанным координатам. Теперь хотелось бы поставить отметку на наше место, чтобы визуально видеть его. Для этого приходит в помощь класс Pushpin

Пишем такой код:

           Point p = new Point(138, 139);
Location Loc = myMap.ViewportPointToLocation(p);

            Pushpin pin1 = new Pushpin();
pin1.Location = Loc;
pin1.Content = "IT";
// Adds the pushpin to the map.
myMap.Children.Add(pin1);

При компиляции увидим, созданную нами отметку.

image

Теперь опишем несколько событий для динамики нашей карты. Сделаем, чтобы при наведении на нашу отметку, она увеличивалась. Будем использовать два события:

            pin1.MouseEnter += new MouseEventHandler(pin1_MouseEnter);
pin1.MouseLeave += new MouseEventHandler(pin1_MouseLeave);

       void pin1_MouseEnter(object sender, MouseEventArgs e)
{
Pushpin pushpin = sender as Pushpin;

            // scaling will shrink (less than 1) or enlarge (greater than 1) source element
ScaleTransform st = new ScaleTransform();
st.ScaleX = 1.4;
st.ScaleY = 1.4;

            // set center of scaling to center of pushpin
st.CenterX = (pushpin as FrameworkElement).Height / 2;
st.CenterY = (pushpin as FrameworkElement).Height / 2;
pushpin.RenderTransform = st;

        }

       void pin1_MouseLeave(object sender, MouseEventArgs e)
{
Pushpin pushpin = sender as Pushpin;

            // remove the pushpin transform when mouse leaves
pushpin.RenderTransform = null;

        }

В результате увидим, что наша отметка увеличивается при наведении мыши и уменьшается, когда курсор убираем. То что и следовало получить.

После того, как мы получили silverlight приложение с картой, необходимо его вставить на наш веб сайт. Для этого запускаем сайт и вставляем веб часть

image