在 UWP 图表应用程序中使用 StrokeDashArray

Using StrokeDashArray in UWP charting-app

我正在尝试在 UWP 应用程序(使用 WinRTXamlToolkit.Controls.DataVisualization.Charting)中制作图表,同时应该会显示多条虚线。但是,只有第一条线是虚线,第二条和第三条线是实线。 我做错了什么还是这是一个错误? 下面是我的 XAML-代码和代码隐藏。我不明白的是:如果 Polyline-属性 StrokeThickness 适用于所有三条线(它们都相当粗),那么为什么 Polyline-属性 StrokeDashArray 只适用于第一条线行??

乔斯兰

<Page
x:Class="TestApp2.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:TestApp2"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:Charting="using:WinRTXamlToolkit.Controls.DataVisualization.Charting"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Page.Resources>
    <Style x:Key="LineSeriesStyle1" TargetType="Charting:LineSeries">
        <Setter Property="IsTabStop" Value="False"/>
        <Setter Property="PolylineStyle">
            <Setter.Value>
                <Style TargetType="Polyline">
                    <Setter Property="StrokeThickness" Value="5"/>
                    <Setter Property="StrokeMiterLimit" Value="1"/>
                    <Setter Property="StrokeDashArray" Value="3"/>
                </Style>
            </Setter.Value>
        </Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Charting:LineSeries">
                    <Canvas x:Name="PlotArea">
                        <Polyline Points="{TemplateBinding Points}" Style="{TemplateBinding PolylineStyle}" Stroke="{TemplateBinding Background}"/>
                    </Canvas>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Page.Resources>

<Grid>
    <Charting:Chart x:Name="LineChart" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="5" ScrollViewer.HorizontalScrollBarVisibility="Visible" Width="400" Height="400">
        <Charting:Chart.Axes>
            <Charting:LinearAxis x:Name="Xas" Orientation="X" Location="Bottom" Interval="1" ShowGridLines="True" Title="X-as" CanDrag="True"/>
            <Charting:LinearAxis x:Name="Yas" Orientation="Y" Location="Left" Interval="1" ShowGridLines="True"/>
        </Charting:Chart.Axes>
        <Charting:LineSeries x:Name="Line0" Style="{StaticResource LineSeriesStyle1}" IndependentValuePath="X" DependentValuePath="Y"/>

        <Charting:LineSeries x:Name="Line1" Style="{StaticResource LineSeriesStyle1}" IndependentValuePath="X" DependentValuePath="Y"/>
        <Charting:LineSeries x:Name="Line2" Style="{StaticResource LineSeriesStyle1}" IndependentValuePath="X" DependentValuePath="Y"/>
    </Charting:Chart>

</Grid>

我的代码隐藏:

using System.Collections.Generic;

使用Windows.Foundation; 使用 Windows.UI.Xaml.Controls;

命名空间 TestApp2 { public 密封部分 class MainPage : Page { public 列表 l0 { get;放; } = 新列表(); public 列表 l1 { get;放; } = 新列表(); public 列表 l2 { get;放; } = 新列表();

    public MainPage()
    {
        this.InitializeComponent();
        l0.Add(new Point(10, 20));
        l0.Add(new Point(11, 21));
        l0.Add(new Point(12, 22));
        l0.Add(new Point(13, 23));
        Line0.ItemsSource=l0;
        
        l1.Add(new Point(10, 30));
        l1.Add(new Point(11, 31));
        l1.Add(new Point(12, 32));
        l1.Add(new Point(13, 33));
        Line1.ItemsSource = l1;

        l2.Add(new Point(10, 40));
        l2.Add(new Point(11, 41));
        l2.Add(new Point(12, 42));
        l2.Add(new Point(13, 43));
        Line2.ItemsSource = l2;
    }
}

}

我测试了你的代码。正如您提到的,LineSeriesStyle1 仅应用于第一行。这是一个已确认的问题,您可以找到问题 here

您可以在LineSeriesStyle1样式的Polyline标签中设置StrokeDashArray属性的值来解决问题。

或者,您可以参考 .

找到另一个解决方案