3D chart padding

[Richard Alvarez]

There seems to be way too much padding around a 3D chart.  A standard chart is fine, but once I add the 3D definition...

<control:RadChart x:Name="RadChart1">
    <control:RadChart.DefaultSeriesDefinition>
        <chart:Bar3DSeriesDefinition ShowItemLabels="False" />
    </control:RadChart.DefaultSeriesDefinition>
</control:RadChart>

 How can I control this?

[Evgenia]

Hi Richard,

I guess you mean that the ChartArea does not fill the available space in the page? Unfortunately even if you change it's dimensions (Width ,Height) to custom values that will cause it to be translated from the center. What I can suggest is that you use the CameraExtension property and zoom it.

Best wishes,
Evgenia
the Telerik team

[Richard Alvarez]

I'll try it, but so far any changes I make to the visual appearance with the camera extension don't show up when I use ExportToImage, which is my additional goal.  I'll look for another way.

[Evgenia]

Hi Richard,

Unfortunately currently it is not possible for the 3D series to fill the entire available chart area. I have forwarded your request to our development team for further consideration.

Greetings,
Evgenia
the Telerik team

[James]

Is there any update on the possibility of having some control over the padding set around a 3D chart?  Currently a much larger area of screen real estate must be used to show the chart.  Thanks.

[Evgenia]

Hello James,

The onliest possible way to achieve this is using the CameraExtension property and zoom in the Chart. 

Kind regards,
Evgenia
the Telerik team

[James]

Evgenia,

Thank you for your answer.

James

[James]

Is it possible to get a code example on how to use the camera extension to zoom each chart to have it optimally fit the window each time while not giving the user the ability to reorient the chart manually with the mouse?

Thanks,

James

[Peshito]

Hello James,

Here is a code snippet demonstrating the use of a CameraExtension and further setting its zoom scale.

radChart1.DefaultView.ChartArea.Extensions.Add(new CameraExtension() { ZoomEnabled = true});
Dispatcher.BeginInvoke(new Action(() => (radChart1.DefaultView.ChartArea.Extensions[0] as CameraExtension).Zoom(1.2)));

More information regarding CameraExtension can be found here. You can also have a look at our Flexible API demo example, which demonstrates how to enable the CameraExtension when switching to a 3D series.

Hope this helps.

All the best,
Peshito
the Telerik team

[James]

Peshito,

I am currently receiving an error of "Object reference not set to an instance of an object." when I try to add a CameraExtension to a chart that first was used to display a 2D charting series.  The user then can decide to change to a 3D series and I do this by clearing the SeriesMapping collection and then adding the 3D SeriesDefinition.  Along with this I want to use the CameraExtension to zoom the 3D chart so that the extra space is filled.  I get the error attempting to add the camera extension.  If I choose to load the 3D series first with the CameraExtension everything works great.  

I will also receive the error if I attempt to remove the extension using the RemoveAt() method as seen in this code:

telerikChart.DefaultView.ChartArea.Extensions.RemoveAt(0);

I don't understand why I am receiving this error.  Am I just not doing things in the right order?  I appreciate any help that you can give. I am using the control version .NET 4 - 2011.2.920.40.

xaml

<UserControl x:Class="CamExtension.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        <telerik:RadChart x:Name="telerikChart" Grid.Row="1" >
        </telerik:RadChart>
        <CheckBox Content="3D" Height="16" Grid.Row="0" HorizontalAlignment="Left" Margin="40,10,0,0" Name="checkBox1" VerticalAlignment="Top" Checked="checkBox1_Checked" IsChecked="False" Unchecked="checkBox1_Unchecked" />
    </Grid>
</UserControl>

using System.Data;
using System.Windows;
using System.Windows.Controls;
using Telerik.Windows.Controls.Charting;
namespace CamExtension
{
   /// <summary>
   /// Interaction logic for MainWindow.xaml
   /// </summary>
   public partial class MainWindow : UserControl
   {
      private bool Chart3d = false;
      private System.Data.DataTable dt = new DataTable();

      public MainWindow()
      {
         InitializeComponent();

         dt.Columns.Add("Month", typeof(string));
         dt.Columns.Add("Sales", typeof(double));
         dt.Rows.Add("Jan", 12000);
         dt.Rows.Add("Feb", 15500);
         dt.Rows.Add("Mar", 20000);
         dt.Rows.Add("Apr", 1300);
         dt.Rows.Add("May", 1200);
         dt.Rows.Add("Jun", 12000);
         dt.Rows.Add("Jul", 13000);
         dt.Rows.Add("Aug", 16000);
         dt.Rows.Add("Sep", 18000);
         dt.Rows.Add("Oct", 11000);
         dt.Rows.Add("Nov", 10000);
         dt.Rows.Add("Dec", 15000);

         InitChart();
         PlotChart(dt);
      }

      private void checkBox1_Unchecked(object sender, RoutedEventArgs e)
      {
         Chart3d = false;
         if (dt.Rows.Count > 0)
         {
            InitChart();
            PlotChart(dt);
         }
      }

      private void checkBox1_Checked(object sender, RoutedEventArgs e)
      {
         Chart3d = true;
         if (dt.Rows.Count > 0)
         {
            InitChart();
            PlotChart(dt);
         }
      }

      private void InitChart()
      {
         telerikChart.DefaultView.ChartTitle.Content = "Year 2009";
         telerikChart.DefaultView.ChartTitle.HorizontalAlignment = HorizontalAlignment.Center;
         telerikChart.DefaultView.ChartLegend.UseAutoGeneratedItems = true;

         telerikChart.ItemsSource = new DataTable();
         telerikChart.SeriesMappings.Clear();
         SeriesMapping sm = new SeriesMapping();
         if (Chart3d)
            sm.SeriesDefinition = new Line3DSeriesDefinition();
         else
            sm.SeriesDefinition = new LineSeriesDefinition();

         sm.ItemMappings.Add(new ItemMapping("Month", DataPointMember.XCategory));
         sm.ItemMappings.Add(new ItemMapping("Sales", DataPointMember.YValue));

         telerikChart.SeriesMappings.Add(sm);

         if (Chart3d)
         {
            if (telerikChart.DefaultView.ChartArea.Extensions.Count == 0)
            {
               CameraExtension camExt = new CameraExtension() { ZoomEnabled = false };
               camExt.ZoomEnabled = true;
               camExt.Zoom(2);
               telerikChart.DefaultView.ChartArea.Extensions.Add(camExt);
            }
            else
            {
               ((CameraExtension)(telerikChart.DefaultView.ChartArea.Extensions[0])).ZoomEnabled = true;
               ((CameraExtension)(telerikChart.DefaultView.ChartArea.Extensions[0])).Zoom(2);
            }
         }
         else
         {
            if (telerikChart.DefaultView.ChartArea.Extensions.Count > 0)
               ((CameraExtension)(telerikChart.DefaultView.ChartArea.Extensions[0])).ZoomEnabled = false;
         }

      }

      private void PlotChart(System.Data.DataTable dt)
      {
         telerikChart.ItemsSource = dt;
      }

   }
}

Thanks,

James

[Peshito]

Hello James,

I have made some changes to your code provided. Shortly the only difference is that you need to attach to the ChartArea Loaded event and move your logic about applying the CameraExtension there. Everything else is properly done and chart should load as expected depending on whether the user has clicked the 3D checkbox or not.

Hope this helps.

Greetings,
Peshito
the Telerik team

[James]

Peshito,

Thanks for the reply!  One thing that I have noticed is if the chart is initially set to 3D and the camera extension is added to the extensions class then it will work for that pass.  If the 3D checkbox is clicked and the seriesdefinitions get changed to 2D then the 2D will show just fine.  The click on the 3D checkbox again and the chart will appear as though no camera extension exists.  The code does not run in the Loaded event because a change of seriesdefinitions does not cause the chart to reload.  Now if I add the code into the Checked event like this:

private void checkBox1_Checked(object sender, RoutedEventArgs e)
        {
            Chart3d = true;
            if (dt.Rows.Count > 0)
            {
                InitChart();
                PlotChart(dt);
            }
            if (telerikChart.DefaultView.ChartArea.Extensions.Count == 0)
            {
               CameraExtension camExt = new CameraExtension() { ZoomEnabled = false };
               camExt.ZoomEnabled = true;
               camExt.Zoom(2);
               telerikChart.DefaultView.ChartArea.Extensions.Add(camExt);
            }
            else
            {
               ((CameraExtension)(telerikChart.DefaultView.ChartArea.Extensions[0])).ZoomEnabled = true;
               ((CameraExtension)(telerikChart.DefaultView.ChartArea.Extensions[0])).Zoom(2);
            }

        }

 and then try to execute that code I get the error at Telerik.Windows.Controls.Charting.CameraExtension.AddAutoZoomExtension(ChartArea owner) in c:\TB\117\WPF_Scrum\Release_WPF_40\Sources\Development\Controls\Chart\Chart\Extensions\CameraExtension.cs:line 451
   at Telerik.Windows.Controls.Charting.CameraExtension.Initialize(ChartArea owner) in c:\TB\117\WPF_Scrum\Release_WPF_40\Sources\Development\Controls\Chart\Chart\Extensions\CameraExtension.cs:line 471
   at Telerik.Windows.Controls.Charting.CameraExtension.Attach(ChartArea owner) in c:\TB\117\WPF_Scrum\Release_WPF_40\Sources\Development\Controls\Chart\Chart\Extensions\CameraExtension.cs:line 154
   at Telerik.Windows.Controls.Charting.BaseExtensionCollection`1.InsertItem(Int32 index, IChartExtension`1 item) in c:\TB\117\WPF_Scrum\Release_WPF_40\Sources\Development\Controls\Chart\Chart\Extensions\BaseExtensionCollection.cs:line 60
   at System.Collections.ObjectModel.Collection`1.Add(T item)
   at CameraExtensionsChartWPF.MainWindow.checkBox1_Checked(Object sender, RoutedEventArgs e) in d:\Users\jwallace\Desktop\CameraExtensionsChartWPF\CameraExtensionsChartWPF\MainWindow.xaml.cs:line 79
   at System.Windows.RoutedEventHandlerInfo.InvokeHandler(Object target, RoutedEventArgs routedEventArgs)
   at System.Windows.EventRoute.InvokeHandlersImpl(Object source, RoutedEventArgs args, Boolean reRaised)
   at System.Windows.UIElement.RaiseEventImpl(DependencyObject sender, RoutedEventArgs args)
   at System.Windows.UIElement.RaiseEvent(RoutedEventArgs e)
   at System.Windows.Controls.Primitives.ToggleButton.OnChecked(RoutedEventArgs e)
   at System.Windows.Controls.Primitives.ToggleButton.OnIsCheckedChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
   at System.Windows.DependencyObject.OnPropertyChanged(DependencyPropertyChangedEventArgs e)
   at System.Windows.FrameworkElement.OnPropertyChanged(DependencyPropertyChangedEventArgs e)
   at System.Windows.DependencyObject.NotifyPropertyChange(DependencyPropertyChangedEventArgs args)
   at System.Windows.DependencyObject.UpdateEffectiveValue(EntryIndex entryIndex, DependencyProperty dp, PropertyMetadata metadata, EffectiveValueEntry oldEntry, EffectiveValueEntry& newEntry, Boolean coerceWithDeferredReference, Boolean coerceWithCurrentValue, OperationType operationType)
   at System.Windows.DependencyObject.SetValueCommon(DependencyProperty dp, Object value, PropertyMetadata metadata, Boolean coerceWithDeferredReference, Boolean coerceWithCurrentValue, OperationType operationType, Boolean isInternal)
   at System.Windows.DependencyObject.SetCurrentValueInternal(DependencyProperty dp, Object value)
   at System.Windows.Controls.Primitives.ToggleButton.OnToggle()
   at System.Windows.Controls.Primitives.ToggleButton.OnClick()
   at System.Windows.Controls.Primitives.ButtonBase.OnMouseLeftButtonUp(MouseButtonEventArgs e)
   at System.Windows.UIElement.OnMouseLeftButtonUpThunk(Object sender, MouseButtonEventArgs e)
   at System.Windows.Input.MouseButtonEventArgs.InvokeEventHandler(Delegate genericHandler, Object genericTarget)
   at System.Windows.RoutedEventArgs.InvokeHandler(Delegate handler, Object target)
   at System.Windows.RoutedEventHandlerInfo.InvokeHandler(Object target, RoutedEventArgs routedEventArgs)
   at System.Windows.EventRoute.InvokeHandlersImpl(Object source, RoutedEventArgs args, Boolean reRaised)
   at System.Windows.UIElement.ReRaiseEventAs(DependencyObject sender, RoutedEventArgs args, RoutedEvent newEvent)
   at System.Windows.UIElement.OnMouseUpThunk(Object sender, MouseButtonEventArgs e)
   at System.Windows.Input.MouseButtonEventArgs.InvokeEventHandler(Delegate genericHandler, Object genericTarget)
   at System.Windows.RoutedEventArgs.InvokeHandler(Delegate handler, Object target)
   at System.Windows.RoutedEventHandlerInfo.InvokeHandler(Object target, RoutedEventArgs routedEventArgs)
   at System.Windows.EventRoute.InvokeHandlersImpl(Object source, RoutedEventArgs args, Boolean reRaised)
   at System.Windows.UIElement.RaiseEventImpl(DependencyObject sender, RoutedEventArgs args)
   at System.Windows.UIElement.RaiseTrustedEvent(RoutedEventArgs args)
   at System.Windows.UIElement.RaiseEvent(RoutedEventArgs args, Boolean trusted)
   at System.Windows.Input.InputManager.ProcessStagingArea()
   at System.Windows.Input.InputManager.ProcessInput(InputEventArgs input)
   at System.Windows.Input.InputProviderSite.ReportInput(InputReport inputReport)
   at System.Windows.Interop.HwndMouseInputProvider.ReportInput(IntPtr hwnd, InputMode mode, Int32 timestamp, RawMouseActions actions, Int32 x, Int32 y, Int32 wheel)
   at System.Windows.Interop.HwndMouseInputProvider.FilterMessage(IntPtr hwnd, WindowMessage msg, IntPtr wParam, IntPtr lParam, Boolean& handled)
   at System.Windows.Interop.HwndSource.InputFilterMessage(IntPtr hwnd, Int32 msg, IntPtr wParam, IntPtr lParam, Boolean& handled)
   at MS.Win32.HwndWrapper.WndProc(IntPtr hwnd, Int32 msg, IntPtr wParam, IntPtr lParam, Boolean& handled)
   at MS.Win32.HwndSubclass.DispatcherCallbackOperation(Object o)
   at System.Windows.Threading.ExceptionWrapper.InternalRealCall(Delegate callback, Object args, Int32 numArgs)
   at MS.Internal.Threading.ExceptionFilterHelper.TryCatchWhen(Object source, Delegate method, Object args, Int32 numArgs, Delegate catchHandler)
   at System.Windows.Threading.Dispatcher.InvokeImpl(DispatcherPriority priority, TimeSpan timeout, Delegate method, Object args, Int32 numArgs)
   at MS.Win32.HwndSubclass.SubclassWndProc(IntPtr hwnd, Int32 msg, IntPtr wParam, IntPtr lParam)
   at MS.Win32.UnsafeNativeMethods.DispatchMessage(MSG& msg)
   at System.Windows.Threading.Dispatcher.PushFrameImpl(DispatcherFrame frame)
   at System.Windows.Threading.Dispatcher.PushFrame(DispatcherFrame frame)
   at System.Windows.Application.RunDispatcher(Object ignore)
   at System.Windows.Application.RunInternal(Window window)
   at System.Windows.Application.Run(Window window)
   at System.Windows.Application.Run()
   at CameraExtensionsChartWPF.App.Main() in d:\Users\jwallace\Desktop\CameraExtensionsChartWPF\CameraExtensionsChartWPF\obj\x86\Debug\App.g.cs:line 0
   at System.AppDomain._nExecuteAssembly(RuntimeAssembly assembly, String[] args)
   at System.AppDomain.ExecuteAssembly(String assemblyFile, Evidence assemblySecurity, String[] args)
   at Microsoft.VisualStudio.HostingProcess.HostProc.RunUsersAssembly()
   at System.Threading.ThreadHelper.ThreadStart_Context(Object state)
   at System.Threading.ExecutionContext.Run(ExecutionContext executionContext, ContextCallback callback, Object state, Boolean ignoreSyncCtx)
   at System.Threading.ExecutionContext.Run(ExecutionContext executionContext, ContextCallback callback, Object state)
   at System.Threading.ThreadHelper.ThreadStart()

Any ideas on how I would get the CameraExtension to working again in this type situation. 

Thanks,


James

[Peshito]

Hi James,

Please, find attached an updated copy of my previous attached example.

Attaching to the ChartArea Loaded event is executed once, this is why I am now wiring to the LayoutUpdated event and then depending on whether the Chart3D is true or false new CameraExtension is being added to the Extensions collection. You should also know that there seems to be unexpected bahavior when the collection is cleared and new extension is being added. The workaround is to add new extension each time when the checkbox is clicked.

Following this approach will change the series definition of your chart from 2D to 3D when the 3D checkbox is clicked.

I hope this approach is feasible and reasonable for you.

Kind regards,
Peshito
the Telerik team