지도에 압정 표시

Question

내가 좋아하는 방식으로 작동하는지도에 압핀을 추가하는 데 큰 어려움을 겪고 있습니다.

먼저 MapItemsControl을 추가하고 바인딩하려고 시도했습니다.

<map:MapItemsControl ItemsSource="{Binding Path=Locations}"> 
    <map:MapItemsControl.ItemTemplate> 
     <DataTemplate> 
      <controls:NumberedCircle Number="{Binding Path=Number}" map:MapControl.Location="{Binding Path=Point}"/>  
     </DataTemplate> 
    </map:MapItemsControl.ItemTemplate> 
</map:MapItemsControl> 

이 방법은 효과가 있지만지도를 이동할 때 전혀 문제가되지 않습니다. 맵 패닝과 압정 아이콘이 예상되는 위치로 따라 잡는 사이에 매우 눈에 띄는 지연이 있습니다. 지도를 앞뒤로 빨리 움직이면 거리의 한 쪽에서 다른 쪽으로 고정 핀 점프를 할 수 있습니다. 이것은 목록에있는 하나의 항목에서만 발생하므로지도가 압도당하는 것처럼 보이지 않습니다.

다음은 효과의 비디오입니다 : http://youtu.be/9FIvkOf71bg

다음 내가 MapElements 컬렉션에 MapIcons를 추가했습니다. 이것은 MVVM을 사용하기 때문에 Behavior에서 수행되었지만 일반적인 아이디어는

var mapIcon = new MapIcon() { Location = pushpinDrawBehavior.Location}; 
mapControl.MapElements.Add(mapIcon); 

위대한 작품입니다. 나는지도를 냄비에 올려 놓고, MapIcon은 내가 얼마나 빨리 움직여도 아무 곳에도 있어야한다. 지체 된 행동이 전혀 없습니다. 그러나 MapIcon은 확대/축소시 문서에 설명 된 것처럼 나타나고 사라집니다.

MapIcon이 표시되지 않을 수 있습니다. 이지도의 다른 요소 나 레이블을 가리면 숨겨져있을 수 있습니다.

지도에 압정을 추가하는 두 가지 방법이 있으며 여러 가지 이유로 끔찍한 사용자 경험을 생성하기 때문에 매우 좌절했습니다. 질문은 다음과 같습니다.

1) 무엇이 있습니까? 팬에서 XAML 요소를 지연시키지 않는 방법이 있습니까? MapIcon을 항상 표시 할 수있는 방법이 있습니까?

2) MapIcon처럼 작동하는 맞춤 클래스를 만드는 방법이 있습니까? 그것은 MapElement에서 파생되지만 압정의 실제 렌더링이 어떻게 수행되는지 또는 이미지, 제목 등의 레이아웃이 정의되는 방법을 볼 수 없습니다. 내 자신의 MapIcon을 만들 수 있다면 잠재적으로 숨기기 동작을 비활성화 할 수 있습니다.

편집 : Nokia 925에서 앱을 실행하면 효과가 눈에 띄지 않습니다 (위의 동영상은 521에서 가져온 것입니다). 지도와 동기화 된 XAML 오버레이를 유지하는 것이 매우 프로세서 집약적 인 것으로 보이며 적은 하드웨어에서 더 많이 악화 될 것입니다.

Answer 1

푸시 핀의 XAML 코드의 요소 또는 복잡성을 줄이는 것 외에는 할 수있는 일이 많지 않습니다.

MapIcon과 MapElements의 차이점은 MapIcon은 맵 컨트롤에 직접 전송되어 렌더링되는 비트 맵이며 MapElements는 XAML 요소이며 XAML 스레드에 의해 렌더링된다는 것입니다. 지연은지도 스레드의지도 상호 작용과 애플리케이션의 UI 스레드 사이에 필요한 동기화 때문에 발생합니다.

푸시 핀의 XAML이 비트 맵으로 사용됩니다 (RenderTargetBitmap 참조). 렌더링에는 다소 시간이 걸릴 수 있지만 MapIcon에 사용할 수 있습니다. 그러나 나는 몇 달 전에 이것을 시도해 왔으며 MapIcon을 항상 표시 할 수있는 방법을 찾지 못했습니다.

언제나 볼 수있는 MapIcon을 갖고 싶은 앱을 개발 중입니다. 앞으로 Map 구성 요소가 변경되기를 바랍니다. 지도에 많은 버그가 있습니다 (예 : 나는 또한 푸시 핀의 앵커 포인트를 변경할 수 없습니다 ... MS는 여기서 많이 개선 될 수 있습니다.

편집 :지도 컨트롤 및 MapIcons/MapElements/...에 대해 자세히 알아 보려면 this BUILD conference talk을 참조하십시오.

Answer 2

이것은 너무 길지만 너무 귀엽지는 않지만 UI 스레드에 MapItemsControl이 채워져 있습니다.

압정에 대한 클래스 만들기 :

public class PushpinData 
{ 
    public GeoCoordinate Location { get; set; } 
    public string Text { get; set; } 
    public SolidColorBrush DisplayBrush { get; set; } 
} 

이 압정을 위해 DataTemplate로 MapControl 만들기 :

xmlns:maps="clr-namespace:Microsoft.Phone.Maps.Controls;assembly=Microsoft.Phone.Maps" 
xmlns:maptk="clr-namespace:Microsoft.Phone.Maps.Toolkit;assembly=Microsoft.Phone.Controls.Toolkit" 

<maps:Map x:Name="mapControl" > 
    <maptk:MapExtensions.Children> 
    <maptk:MapItemsControl x:Name="PushpinLayer"> 
     <maptk:MapItemsControl.ItemTemplate> 
      <DataTemplate> 
       <maptk:Pushpin GeoCoordinate="{Binding Location}" 
       Content="{Binding Text}" 
       Background="{Binding DisplayBrush}"/> 
      </DataTemplate> 
     </maptk:MapItemsControl.ItemTemplate> 
    </maptk:MapItemsControl> 
    </maptk:MapExtensions.Children> 
</maps:Map> 

하면보기 및지도 컨트롤의 Loaded 이벤트에 압정 목록 선언을 얻을 MapItemsControl을 참조하고 ItemsSource을 지정하십시오.

using Microsoft.Phone.Maps.Toolkit; 

ObservableCollection<PushpinData> pushpinList = new ObservableCollection<PushpinData>(); 

mapControl.Loaded += (s, e) => 
    { 
    ObservableCollection<DependencyObject> children = MapExtensions.GetChildren(mapControl); 
    var pushPinLayer = children.FirstOrDefault(x => x.GetType() == typeof(MapItemsControl)) as MapItemsControl; 
    pushPinLayer.ItemsSource = pushpinList; 
    } 

일단 가지고 있다면 pushpinList을 채울 수 있습니다.MVVM을 손상시키지 않으려면 물론 Messenger의 정렬을 통해 VM에서 푸시 핀 목록을받을 수 있습니다. 또한 압정 컬렉션에 주어진 시간에 표시되는 컬렉션 만 포함되어 있는지 확인하십시오.