mirror of
https://gitee.com/akwkevin/aistudio.-wpf.-diagram
synced 2026-03-07 10:10:49 +08:00
91 lines
5.2 KiB
XML
91 lines
5.2 KiB
XML
<UserControl x:Class="Wpf.CartesianChart.Funnel_Chart.FunnelExample"
|
|
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
|
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
|
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
|
|
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
|
|
xmlns:local="clr-namespace:Wpf.CartesianChart.Funnel_Chart"
|
|
xmlns:lvc="clr-namespace:LiveCharts.Wpf;assembly=LiveCharts.Wpf"
|
|
mc:Ignorable="d"
|
|
d:DesignHeight="600" d:DesignWidth="600">
|
|
<Grid Background="#14144B">
|
|
<!-- Credit https://dribbble.com/shots/2673159-Funnel-UI-concept-->
|
|
<!-- Icons http://www.flaticon.com/authors/madebyoliver -->
|
|
<Grid.Resources>
|
|
<Style TargetType="lvc:LineSeries">
|
|
<Setter Property="PointGeometry" Value="{x:Null}"/>
|
|
<Setter Property="AreaLimit" Value="0"/>
|
|
<Setter Property="StrokeThickness" Value="0" />
|
|
<Setter Property="Fill" Value="#216AFE"></Setter>
|
|
</Style>
|
|
<Style TargetType="lvc:Axis">
|
|
<Setter Property="IsEnabled" Value="False"/>
|
|
<Setter Property="ShowLabels" Value="False"></Setter>
|
|
</Style>
|
|
</Grid.Resources>
|
|
<lvc:CartesianChart Hoverable="False" DataTooltip="{x:Null}">
|
|
<lvc:CartesianChart.Series>
|
|
<lvc:LineSeries Values="100, 85, 50, 35, 5, 3"/>
|
|
<lvc:LineSeries Values="-100, -85, -50, -35, -5, 3"/>
|
|
|
|
<!--Shadows-->
|
|
<lvc:LineSeries Values="110, 94, 60, 40, 10, 10" Fill="#222C78" Panel.ZIndex="-1"/>
|
|
<lvc:LineSeries Values="-110, -94, -60, -40, -10, -10" Fill="#222C78" Panel.ZIndex="-1"/>
|
|
|
|
<lvc:LineSeries Values="120, 104, 70, 50, 15, 15" Fill="#141859" Panel.ZIndex="-2"/>
|
|
<lvc:LineSeries Values="-120, -104, -70, -50, -15, -15" Fill="#141859" Panel.ZIndex="-2"/>
|
|
</lvc:CartesianChart.Series>
|
|
<lvc:CartesianChart.AxisX>
|
|
<lvc:Axis>
|
|
<lvc:Axis.Sections>
|
|
<lvc:AxisSection Value="1.5" Stroke="#25FFFFFF" StrokeThickness="5" Panel.ZIndex="1" />
|
|
<lvc:AxisSection Value="3.5" Stroke="#25FFFFFF" StrokeThickness="5" Panel.ZIndex="1" />
|
|
</lvc:Axis.Sections>
|
|
</lvc:Axis>
|
|
</lvc:CartesianChart.AxisX>
|
|
<lvc:CartesianChart.VisualElements>
|
|
<lvc:VisualElement X="0.75" Y="120" VerticalAlignment="Bottom" HorizontalAlignment="Center">
|
|
<lvc:VisualElement.UIElement>
|
|
<StackPanel Orientation="Vertical">
|
|
<Image Source="resources/user.png"></Image>
|
|
<TextBlock Foreground="White" FontSize="16" FontWeight="Bold">LOADED THE AD</TextBlock>
|
|
</StackPanel>
|
|
</lvc:VisualElement.UIElement>
|
|
</lvc:VisualElement>
|
|
<lvc:VisualElement X="0.75" Y="0" VerticalAlignment="Center" HorizontalAlignment="Center">
|
|
<lvc:VisualElement.UIElement>
|
|
<TextBlock Foreground="White" FontSize="40">100 %</TextBlock>
|
|
</lvc:VisualElement.UIElement>
|
|
</lvc:VisualElement>
|
|
|
|
<lvc:VisualElement X="2.5" Y="120" VerticalAlignment="Bottom" HorizontalAlignment="Center">
|
|
<lvc:VisualElement.UIElement>
|
|
<StackPanel Orientation="Vertical">
|
|
<Image Source="resources/view.png"></Image>
|
|
<TextBlock Foreground="White" FontSize="16" FontWeight="Bold">SAW THE AD</TextBlock>
|
|
</StackPanel>
|
|
</lvc:VisualElement.UIElement>
|
|
</lvc:VisualElement>
|
|
<lvc:VisualElement X="2.5" Y="0" VerticalAlignment="Center" HorizontalAlignment="Center">
|
|
<lvc:VisualElement.UIElement>
|
|
<TextBlock Foreground="White" FontSize="40">50 %</TextBlock>
|
|
</lvc:VisualElement.UIElement>
|
|
</lvc:VisualElement>
|
|
|
|
<lvc:VisualElement X="4.25" Y="120" VerticalAlignment="Bottom" HorizontalAlignment="Center">
|
|
<lvc:VisualElement.UIElement>
|
|
<StackPanel Orientation="Vertical">
|
|
<Image Source="resources/fingerprint.png"></Image>
|
|
<TextBlock Foreground="White" FontSize="16" FontWeight="Bold">INTERACTED</TextBlock>
|
|
</StackPanel>
|
|
</lvc:VisualElement.UIElement>
|
|
</lvc:VisualElement>
|
|
<lvc:VisualElement X="4.25" Y="0" VerticalAlignment="Center" HorizontalAlignment="Center">
|
|
<lvc:VisualElement.UIElement>
|
|
<TextBlock Foreground="White" FontSize="40">5 %</TextBlock>
|
|
</lvc:VisualElement.UIElement>
|
|
</lvc:VisualElement>
|
|
</lvc:CartesianChart.VisualElements>
|
|
</lvc:CartesianChart>
|
|
</Grid>
|
|
</UserControl>
|