0

我正在开发 UWP 导航应用程序。

我想做的事？

  1. 我想在 Map 控件上绘制多条（准确地说是 10 条）折线。
  2. 我想要一个是不同的颜色，而其他的是灰色的。
  3. 一旦选择了其中一条折线，新选择的折线将变为原色，而其他折线为灰色。类似地图应用程序的多条路线只是在更大的范围内显示运输卡车的运动。

网上到处都有通过 c# 或代码实现折线的方法，但我想通过 XAML 来实现，因为从代码隐藏中添加 10 条折线不会为事件和不透明度以及标签和名称提供太大的灵活性。

我都尝试了什么：

我尝试为 mapElement 创建一条附加的折线，但该方法的问题是我每次都必须删除并重新创建折线以更改颜色。更多关于这里的信息。此外，这只是从后面的代码实现折线的一种很好的方式。

我目前在做什么：

我在Page.Resources下面添加了折线的 DataTemplate：

 <DataTemplate x:Key="PolylineDataTemplate" x:DataType="polyLineData:IPolylinePath">
        <Polyline Points="{x:Bind Polyline,Mode=OneWay}" Fill="{x:Bind PolylineColor,Mode=OneWay}" Tag="{x:Bind PolylineTag,Mode=OneWay}" StrokeThickness="{x:Bind PolylineThinkness}" />
    </DataTemplate>`

其中 IPolylinePath 定义为：

public interface IPolylinePath
{
    SolidColorBrush PolylineColor { get; set; }

    int PolylineThinkness { get; set; }

    string PolylineTag { get; set; }

    IEnumerable<IBasicGeoposition> PolylinePoints { get; set; }

    Geopath PolylineGeopath { get; }

    PointCollection Polyline { get; }
}`

我的Polyline财产填充如下：

 public PointCollection Polyline
    {
        get
        {
            PointCollection returnObject = new PointCollection();
            //could have used LINQ but wanted to check if the collection is being populated correctly
            foreach (var location in PolylinePoints)
            {
                returnObject.Add(new Windows.Foundation.Point(location.Latitude, location.Longitude));
            }
            return returnObject;
        }
    }

我只是在 MapItems 控件中调用它，如下所示：

<maps:MapControl x:Name="MyMap"  >
                <maps:MapItemsControl ItemTemplate="{StaticResource PolylineDataTemplate}" ItemsSource="{x:Bind ViewModel.PolylinePoints}"/>
            </maps:MapControl>

问题是：

该代码运行良好。只是折线不可见。我以为它只是很小，所以我看不到它。所以我增加了大小和距离，它只是在左上角显示为一个小弧（有一些间距），并且没有被范围或平移。

有人可以帮忙吗？

4

1 回答 1

1

只是折线不可见。

首先，您似乎没有为 提供Stoke属性Polyline，默认情况下它为空。您的代码片段设置颜色与Fill 属性不是线的颜色，您可能会发现 的值与属性StrokeThickness没有影响，Polyline没有属性将看不到直线Stroke。所以这里的颜色应该绑定到Stroke属性。

它只是在左上角显示为一个小弧

这是因为您为by 代码行构建了Points属性点。纬度和经度定义了非应用程序视图上的元素位置。换句话说，实际上您将 a 添加到，而不是 a 。因此，您可能需要将 to 转移到by方法。Polylinenew Windows.Foundation.Point(location.Latitude, location.Longitude)MapControlGeoPointPointCollectionPointGeoPointPointGetOffsetFromLocation(Geopoint, Point)

不会被限定或平移。

为此， thePolyline实际上是一个形状而不是 a MapElement。您应该MapLocation通过监听地图缩放事件来控制它。如果您希望它与地图一起平移，则应使用Map​Polyline. 此示例请参考官方示例的场景二。但是MapPolyline不能直接通过绑定添加，只有后面的代码。

根据您的测试完成的简单示例如下：

XAML

<Page.Resources>
   <DataTemplate x:Key="PolylineDataTemplate" x:DataType="local:PolylinePath">
       <Polyline
           Points="{x:Bind Polyline}"
           Stroke="{x:Bind PolylineColor}"
           StrokeThickness="{x:Bind PolylineThinkness}"
           Tag="{x:Bind PolylineTag}" />
   </DataTemplate>
</Page.Resources>
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
   <maps:MapControl x:Name="MyMap" Loaded="MyMap_Loaded">
       <maps:MapItemsControl x:Name="mapitems" ItemTemplate="{StaticResource PolylineDataTemplate}" />
   </maps:MapControl>
   <Button
       x:Name="btnaddpolyline"
       Click="btnaddpolyline_Click"
       Content="add" />
</Grid>

后面的代码：

public sealed partial class MainPage : Page
{
    public List<PolylinePath> polylines { get; set; }
    Geopoint SeattleGeopoint = new Geopoint(new BasicGeoposition() { Latitude = 47.604, Longitude = -122.329 });       
    public MainPage()
    {
        this.InitializeComponent();
    }
    private void MyMap_Loaded(object sender, RoutedEventArgs e)
    {
        MyMap.Center = SeattleGeopoint;
        MyMap.ZoomLevel = 16;
    }
    private void btnaddpolyline_Click(object sender, RoutedEventArgs e)
    {
        polylines = new List<PolylinePath>()
        {
            new PolylinePath(MyMap)
            {
                PolylineColor=new SolidColorBrush(Colors.Red),
                PolylineThinkness=3,
                PolylineTag="testing",
                PolylinePoints = new List<BasicGeoposition>()
                {
                    SeattleGeopoint.Position,
                    new BasicGeoposition()
                    {
                        Latitude = SeattleGeopoint.Position.Latitude + 0.003,
                        Longitude = SeattleGeopoint.Position.Longitude - 0.003
                    }
                }
            }
        };
        mapitems.ItemsSource = polylines;
    }
}
public class PolylinePath
{
    public PolylinePath(MapControl MyMap)
    {
        this.MyMap = MyMap;
    }
    MapControl MyMap;
    public SolidColorBrush PolylineColor { get; set; }

    public int PolylineThinkness { get; set; }

    public string PolylineTag { get; set; }

    public IEnumerable<BasicGeoposition> PolylinePoints { get; set; }

    public PointCollection Polyline
    {
        get
        {
            PointCollection returnObject = new PointCollection();
            //could have used LINQ but wanted to check if the collection is being populated correctly
            foreach (var location in PolylinePoints)
            {
                Point actualpoint;
                MyMap.GetOffsetFromLocation(new Geopoint(location), out actualpoint);
                returnObject.Add(actualpoint);
            }
            return returnObject;
        }
    }
}
于 2017-05-10T09:40:37.610 回答