how to remove area around the Chart (WPF)

Mar 24, 2010 at 6:05 PM

Hi Experts,

I am new to charting in WPF. I am using WPF toolkit June 2009 (codeplex) to develop line charts. Due to lack of documentation can not figure out how to remove the chartarea around the plotarea of chart?

When I draw the graph it shows the line chart with a big chart area around it. I do not want chart area as I have to draw many line charts in a stackpanel.  

<StackPanel Grid.Row="2" Background="LightBlue">

        <DVC:Chart x:Name="ChromeLightChart">

          <DVC:Chart.Series>

            <DVC:LineSeries Title="Light" 

             IndependentValueBinding="{Binding Path=Key}"

             DependentValueBinding="{Binding Path=Value}">

            </DVC:LineSeries>            

         </DVC:Chart.Series>

        </DVC:Chart>

        <DVC:Chart x:Name="SimpleLightChart">

          <DVC:Chart.Series>

            <DVC:LineSeries Title="Suction" x:Name="myChart" 

             IndependentValueBinding="{Binding Path=Key}"

              DependentValueBinding="{Binding Path=Value}">

            </DVC:LineSeries>

          </DVC:Chart.Series>

        </DVC:Chart>

      </StackPanel>

 

 

In code: 

ChromeLightChart.BorderThickness = new Thickness(0);      

 

            ((LineSeries)ChromeLightChart.Series[0]).ItemsSource =

                new KeyValuePair<DateTime, int>[]{

            new KeyValuePair<DateTime, int>(DateTime.Now, 100),

            new KeyValuePair<DateTime, int>(DateTime.Now.Subtract(TimeSpan.FromMinutes(1)), 130),

            new KeyValuePair<DateTime, int>(DateTime.Now.Subtract(TimeSpan.FromMinutes(2)), 150),

            new KeyValuePair<DateTime, int>(DateTime.Now.Subtract(TimeSpan.FromMinutes(3)), 125),

            new KeyValuePair<DateTime, int>(DateTime.Now.Subtract(TimeSpan.FromMinutes(4)),155) };

 

            ((LineSeries)SimpleLightChart.Series[0]).ItemsSource =

                new KeyValuePair<DateTime, int>[]{

            new KeyValuePair<DateTime, int>(DateTime.Now, 100),

            new KeyValuePair<DateTime, int>(DateTime.Now.AddMinutes(1), 130),

            new KeyValuePair<DateTime, int>(DateTime.Now.AddMinutes(2), 150),

            new KeyValuePair<DateTime, int>(DateTime.Now.AddMinutes(3), 125),

            new KeyValuePair<DateTime, int>(DateTime.Now.AddMinutes(4),155) };

 

Could you please guide me. I can not find enough information and documentation about this WPF charts on net.

Mar 31, 2010 at 3:48 PM
Edited Mar 31, 2010 at 3:50 PM
You need to retemplate the chart. Could look something like this: <chartingToolkit:Chart x:Name="testChart" > <chartingToolkit:Chart.Template> <ControlTemplate TargetType="chartingToolkit:Chart"> <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}"> <chartingprimitives:EdgePanel x:Name="ChartArea" Style="{TemplateBinding ChartAreaStyle}"> <Grid Canvas.ZIndex="-1" Style="{TemplateBinding PlotAreaStyle}" /> <Border Canvas.ZIndex="10" BorderBrush="#FF919191" BorderThickness="1" /> </chartingprimitives:EdgePanel> </Border> </ControlTemplate> </chartingToolkit:Chart.Template> </chartingToolkit:Chart> Looking in the source into DataVisualization\Themes\Generic.xaml often helps. p.s. -------- I really don't know why it is so strangely formatted.
Mar 31, 2010 at 4:08 PM

erni23 thanks for reply.

 

Where can I find the DataVisualization\Themes\Generic.xaml. I think I am missing few headers.

chartingTookit is perhaps belongs to this header

xmlns:DVC="clr-namespace:System.Windows.Controls.DataVisualization.Charting;assembly=System.Windows.Controls.DataVisualization.Toolkit"

 

No idea about chartingprimitives?. 

 

Mar 31, 2010 at 4:59 PM

yeah got it. thanks erni23

 

chartingprimitives belongs to 

"clr-namespace:System.Windows.Controls.DataVisualization.Charting.Primitives;assembly=System.Windows.Controls.DataVisualization.Toolkit"
Apr 1, 2010 at 9:57 AM

Thats correct :).

If you download the source of the WPF Toolkit you find the generic.xaml in the folder

Toolkit-release\DataVisualization\Themes

Aug 12, 2010 at 9:20 PM

Thanks for the tip, that is good stuff.  Although how can I keep the legend?

Nov 20, 2014 at 10:53 AM
ernii23 wrote:
You need to retemplate the chart. Could look something like this: <chartingToolkit:Chart x:Name="testChart" > <chartingToolkit:Chart.Template> <ControlTemplate TargetType="chartingToolkit:Chart"> <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}"> <chartingprimitives:EdgePanel x:Name="ChartArea" Style="{TemplateBinding ChartAreaStyle}"> <Grid Canvas.ZIndex="-1" Style="{TemplateBinding PlotAreaStyle}" /> <Border Canvas.ZIndex="10" BorderBrush="#FF919191" BorderThickness="1" /> </chartingprimitives:EdgePanel> </Border> </ControlTemplate> </chartingToolkit:Chart.Template> </chartingToolkit:Chart> Looking in the source into DataVisualization\Themes\Generic.xaml often helps. p.s. -------- I really don't know why it is so strangely formatted.
When I use this code, and add dynamically LineSeries, I don't see the series... (I must add the series dynamically because I don't know how many serieses I will need).