Tagged Column Series in Wpf

I use System.Windows.Controls.DataVisualization.Toolkit.dll to create diagrams for my wpf based application in C #. Here is my xaml for the chart.

 <chartingToolkit:Chart Name="chartDailySales" Title="Monthly Sales" VerticalAlignment="Top" Margin="10,10,0,0" Height="262" BorderBrush="#00000000" DataContext="{Binding}" IsTabStop="True" Background="#ffbcd5c7"> <!-- Plot area--> <chartingToolkit:Chart.PlotAreaStyle> <Style TargetType="Grid"> <Setter Property="Background" Value="White" /> </Style> </chartingToolkit:Chart.PlotAreaStyle> <!-- Hide Legend--> <chartingToolkit:Chart.LegendStyle> <Style TargetType="Control"> <Setter Property="Width" Value="0"/> <Setter Property="Height" Value="0"/> </Style> </chartingToolkit:Chart.LegendStyle> <chartingToolkit:ColumnSeries DependentValuePath="Value" IndependentValuePath="Key" ItemsSource="{Binding}" IsSelectionEnabled="False" > <chartingToolkit:ColumnSeries.DataPointStyle> <Style TargetType="chartingToolkit:ColumnDataPoint"> <Setter Property="Background" Value="#ff217346"/> <Setter Property="BorderBrush" Value="#ff217346" /> <Setter Property="BorderThickness" Value="1" /> </Style> </chartingToolkit:ColumnSeries.DataPointStyle> </chartingToolkit:ColumnSeries> </chartingToolkit:Chart> 

And here is the code to populate the data.

 List<KeyValuePair<string, double>> monthlySalesList = new List<KeyValuePair<string, double>>(); monthlySalesList.Add(new KeyValuePair<string, double>("JAN", 1234 )); monthlySalesList.Add(new KeyValuePair<string, double>("FEB", 2204)); monthlySalesList.Add(new KeyValuePair<string, double>("MAR", 3234)); monthlySalesList.Add(new KeyValuePair<string, double>("APR", 3234)); monthlySalesList.Add(new KeyValuePair<string, double>("MAY", 5234)); monthlySalesList.Add(new KeyValuePair<string, double>("JUN", 6234)); monthlySalesList.Add(new KeyValuePair<string, double>("JUL", 8234)); monthlySalesList.Add(new KeyValuePair<string, double>("AUG", 6234)); monthlySalesList.Add(new KeyValuePair<string, double>("SEP", 7234)); monthlySalesList.Add(new KeyValuePair<string, double>("OCT", 9234)); monthlySalesList.Add(new KeyValuePair<string, double>("NOV", 11234)); monthlySalesList.Add(new KeyValuePair<string, double>("DEC", 10234)); chartDailySales.DataContext = monthlySalesList; 

And here is the way out. enter image description here

Now, as I mark the chart as follows. enter image description here

Thanks.

+6
source share
3 answers

Why don't you change the ColumnDataPoint template inside the DataPointStyle similar here

+2
source
  <charting:ColumnSeries Height="350" Foreground="Black" ItemsSource="{Binding Path=MyCurrentResultsView.ResultsView}" IndependentValueBinding="{Binding Key}" DependentValueBinding="{Binding Value}"> <charting:ColumnSeries.DataPointStyle> <Style TargetType="charting:ColumnDataPoint"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="charting:ColumnDataPoint"> <Grid> <Rectangle Fill="{TemplateBinding Background}" Stroke="Black"/> <Grid Margin="0 -20 0 0" HorizontalAlignment="Center" VerticalAlignment="Top"> <TextBlock Text="{TemplateBinding FormattedDependentValue}" Margin="2"/> </Grid> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </charting:ColumnSeries.DataPointStyle> 

+1
source

How about something like this:

 <Window xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:chartingToolkit="clr-namespace:System.Windows.Controls.DataVisualization.Charting;assembly=System.Windows.Controls.DataVisualization.Toolkit" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" x:Class="WpfApplication1.MainWindow" Title="MainWindow" Height="350" Width="525"> <Window.Resources> <Style x:Key="ColumnDataPointStyle1" TargetType="{x:Type chartingToolkit:ColumnDataPoint}"> <Setter Property="Background" Value="#ff217346" /> <Setter Property="BorderBrush" Value="#ff217346" /> <Setter Property="BorderThickness" Value="1" /> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type chartingToolkit:ColumnDataPoint}"> <Grid> <Rectangle Fill="{TemplateBinding Background}" Stroke="Black" /> <TextBlock Text="{TemplateBinding FormattedDependentValue}" Foreground="Black" Margin="0,-14,0,0" FontSize="8" FontWeight="Bold" /> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </Window.Resources> <Grid> <chartingToolkit:Chart Name="chartDailySales" Title="Monthly Sales" VerticalAlignment="Top" Margin="10,10,0,0" Height="262" BorderBrush="#00000000" DataContext="{Binding}" IsTabStop="True" Background="#ffbcd5c7"> <!-- Plot area--> <chartingToolkit:Chart.PlotAreaStyle> <Style TargetType="Grid"> <Setter Property="Background" Value="White" /> </Style> </chartingToolkit:Chart.PlotAreaStyle> <!-- Hide Legend--> <chartingToolkit:Chart.LegendStyle> <Style TargetType="Control"> <Setter Property="Width" Value="0" /> <Setter Property="Height" Value="0" /> </Style> </chartingToolkit:Chart.LegendStyle> <chartingToolkit:ColumnSeries DependentValuePath="Value" IndependentValuePath="Key" ItemsSource="{Binding}" IsSelectionEnabled="False" DataPointStyle="{DynamicResource ColumnDataPointStyle1}" /> </chartingToolkit:Chart> </Grid> </Window> 
0
source

Source: https://habr.com/ru/post/958014/


All Articles