This is a migrated thread and some comments may be shown as answers.

Print RadChart

23 Answers 275 Views
Chart
This is a migrated thread and some comments may be shown as answers.
Alessio
Top achievements
Rank 1
Alessio asked on 28 Jun 2010, 11:30 AM
Hi, I tried to print a radchart as shown in Vladimir Enchev's blogUnfortunately, it doesn't show dataseries. Any suggestions? Here my code...
        public RadChart GetChart() 
        { 
            RadChart telerikChart = new RadChart(); 
            Grid grid = new Grid(); 
            grid.RowDefinitions.Add(new RowDefinition {Height = new GridLength(25, GridUnitType.Auto)}); 
            grid.RowDefinitions.Add(new RowDefinition()); 
            grid.ColumnDefinitions.Add(new ColumnDefinition()); 
            grid.ColumnDefinitions.Add(new ColumnDefinition()); 
            grid.ColumnDefinitions.Add(new ColumnDefinition {Width = new GridLength(100, GridUnitType.Auto)}); 
            telerikChart.UseDefaultLayout = false
            telerikChart.Content = grid; 
 
            //Monthly Sales for 2009 
            //Chart Title 
            ChartTitle monthlySalesTitle = new ChartTitle(); 
            monthlySalesTitle.Content = "Monthly Sales for 2009"
            monthlySalesTitle.HorizontalAlignment = HorizontalAlignment.Center; 
            grid.Children.Add(monthlySalesTitle); 
 
            //Chart Area 
            ChartArea monthlySalesChart = new ChartArea(); 
            monthlySalesChart.EnableAnimations = false
            monthlySalesChart.EnableStripLinesAnimation = false
            Grid.SetRow(monthlySalesChart, 1); 
            grid.Children.Add(monthlySalesChart); 
            DataSeries monthlySalesDataSeries = new DataSeries(); 
            monthlySalesDataSeries.Definition = new BarSeriesDefinition(); 
 
            monthlySalesDataSeries.Add(new DataPoint {YValue = 38, XCategory = "Jan"}); 
            monthlySalesDataSeries.Add(new DataPoint {YValue = 65, XCategory = "Feb"}); 
            monthlySalesDataSeries.Add(new DataPoint {YValue = 30, XCategory = "Mar"}); 
            monthlySalesDataSeries.Add(new DataPoint {YValue = 63, XCategory = "Apr"}); 
            monthlySalesDataSeries.Add(new DataPoint {YValue = 98, XCategory = "May"}); 
            monthlySalesDataSeries.Add(new DataPoint {YValue = 47, XCategory = "Jun"}); 
            monthlySalesDataSeries.Add(new DataPoint {YValue = 91, XCategory = "Jul"}); 
            monthlySalesDataSeries.Add(new DataPoint {YValue = 99, XCategory = "Aug"}); 
            monthlySalesDataSeries.Add(new DataPoint {YValue = 32, XCategory = "Sep"}); 
            monthlySalesDataSeries.Add(new DataPoint {YValue = 77, XCategory = "Oct"}); 
            monthlySalesDataSeries.Add(new DataPoint {YValue = 62, XCategory = "Nov"}); 
            monthlySalesDataSeries.Add(new DataPoint {YValue = 38, XCategory = "Dec"}); 
 
            monthlySalesChart.DataSeries.Add(monthlySalesDataSeries); 
 
            //Sales Per Manufacturer 
            //Chart Title 
            ChartTitle perManufacturerTitle = new ChartTitle(); 
            perManufacturerTitle.Content = "Sales per Manufacturer"
            perManufacturerTitle.HorizontalAlignment = HorizontalAlignment.Center; 
            Grid.SetColumn(perManufacturerTitle, 1); 
            grid.Children.Add(perManufacturerTitle); 
 
            ////Chart Legend 
            ChartLegend legend = new ChartLegend(); 
            legend.UseAutoGeneratedItems = true
            legend.Header = string.Empty; 
            legend.Name = "ChartLegendManufacturers"
            Grid.SetColumn(legend, 2); 
            Grid.SetRow(legend, 1); 
            grid.Children.Add(legend); 
 
            ////Chart Area 
            ChartArea perManufacturerChart = new ChartArea(); 
            perManufacturerChart.LegendName = "ChartLegendManufacturers"
            Grid.SetRow(perManufacturerChart, 1); 
            Grid.SetColumn(perManufacturerChart, 1); 
            grid.Children.Add(perManufacturerChart); 
 
            DataSeries perManufacturerDataSeries = new DataSeries(); 
            perManufacturerDataSeries.Definition = new DoughnutSeriesDefinition(); 
            perManufacturerDataSeries.Definition.ItemLabelFormat = "p"
            perManufacturerDataSeries.Add(new DataPoint {YValue = 0.215208267, LegendLabel = "Toyota"}); 
            perManufacturerDataSeries.Add(new DataPoint {YValue = 0.192960612, LegendLabel = "General Motors"}); 
            perManufacturerDataSeries.Add(new DataPoint {YValue = 0.151830229, LegendLabel = "Volkswagen"}); 
            perManufacturerDataSeries.Add(new DataPoint {YValue = 0.125964366, LegendLabel = "Ford"}); 
            perManufacturerDataSeries.Add(new DataPoint {YValue = 0.091152353, LegendLabel = "Honda"}); 
            perManufacturerDataSeries.Add(new DataPoint {YValue = 0.079093251, LegendLabel = "Nissan"}); 
            perManufacturerDataSeries.Add(new DataPoint {YValue = 0.079093251, LegendLabel = "PSA"}); 
            perManufacturerDataSeries.Add(new DataPoint {YValue = 0.064697675, LegendLabel = "Hyundai"}); 
 
            perManufacturerChart.DataSeries.Add(perManufacturerDataSeries); 
 
            return telerikChart; 
        } 
 
        private void ButtonPrint_Click(object sender, RoutedEventArgs e) 
        { 
            RadChart chartToPrint = GetChart(); 
            Print(chartToPrint, "test"); 
        } 
 
        public static void Print(UIElement source, string documentName) 
        { 
            var doc = new PrintDocument(); 
 
            var offsetY = 0d; 
            var totalHeight = 0d; 
 
            var canvas = new Canvas(); 
            canvas.Children.Add(source); 
 
            doc.PrintPage += (s, e) => 
                                 { 
                                     e.PageVisual = canvas; 
 
                                     if (totalHeight == 0) 
                                     { 
                                         totalHeight = source.DesiredSize.Height; 
                                     } 
 
                                     Canvas.SetTop(source, -offsetY); 
 
                                     offsetY += e.PrintableArea.Height; 
                                     e.HasMorePages = offsetY <= totalHeight; 
                                 }; 
            doc.Print(documentName); 
        } 

23 Answers, 1 is accepted

Sort by
0
Alessio
Top achievements
Rank 1
answered on 30 Jun 2010, 09:16 AM
It seems that only BarSeriesDefinition and HorizontalBarSeriesDefinition doesn't work properly. Thanks
0
Nikolay
Telerik team
answered on 30 Jun 2010, 11:29 AM
Hi Alessio,

Thank you for bringing this to our attention. It appears that there is an issue when printing RadChart with UseDefaultLayout = false. The issue has been logged for our developers to look into and provide a fix in one of the future versions of the control.

Your Telerik points have been updated.

Best wishes,
Nikolay
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
0
Nuno
Top achievements
Rank 1
answered on 23 Aug 2010, 09:45 PM

Hi all,

I steped into this same issue. It seems it also happens when UseDefaultLayout = true

Any news on this issue Telerik ? Is there a workaround ?

Thank you.

Nuno

0
Nikolay
Telerik team
answered on 26 Aug 2010, 11:37 AM
Hi Nuno,

This issue is in our immediate plans, our developers will work on it and a fix will be provided with one of our upcoming latest internal builds ( LIB ), released every Friday.

Sincerely yours,
Nikolay
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
0
Nuno
Top achievements
Rank 1
answered on 26 Aug 2010, 01:30 PM

Hi all,

I found a workaround and I'd like to share with everyone. Hope it helps until Telerik provides the mentioned fix.

In my case I use: telerikChart.UseDefaultLayout = true; because I like the default layout and I didn't need to spend more time customizing it.

The trick is: create your RadChart like Alessio did but instead of calling Print(UIElement source, string documentName)  righ away, first add the RadChart to a Grid child collection (Grid declared in the XAML) and then pass that Grid as the UIElement of the Print Method.
If you don't need the Grid in the UI just set its opacity  Opacity="100". It's not a good thing but the Grid must be part of the XAML elements tree.

I'd modify Alessio code to:

private void ButtonPrint_Click(object sender, RoutedEventArgs e)   
{   
    RadChart chartToPrint = GetChart();   
    dummyGrid.Children.Clear(); //GRID IN XAML 
    dummyGrid.Children.Add(chartToPrint); 
    Print(dummyGrid, "test");   
}   

This way BarSeriesDefinition and HorizontalBarSeriesDefinition should be printed properly.

Once again, hope it helps!

Best regards,
Nuno

0
sachin
Top achievements
Rank 1
answered on 25 Oct 2010, 01:09 PM
Hi All,

I am using Telerik controls for Silverlight 3 in my application. I have the same requirement of printing a chart. The problem is that somehow I am not able to find the Class PrintDocument(). Am I missing some reference or this class is only available with silverlight 4 controls. 

If this is only available with silverlight 4, how can I achieve the same functionality with silverlight 3??

Thanks,
Sachin
0
Vlad
Telerik team
answered on 25 Oct 2010, 01:11 PM
Hello,

 Indeed printing is available only in Silverlight 4. 

Kind regards,
Vlad
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
0
sachin
Top achievements
Rank 1
answered on 25 Oct 2010, 02:58 PM
Hi Vlad,

Thanks for the quick reply. Is there any workaround or hack available through which I can achieve the printing functionality. If print is not possible saving of chart as an image would also do. Can you please provide any reference for that.

Thanks,
Sachin
0
Vlad
Telerik team
answered on 25 Oct 2010, 03:08 PM
Hello,

 You can check this demo for more info about how to save the chart as image in Silverlight 3. 

All the best,
Vlad
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
0
sachin
Top achievements
Rank 1
answered on 25 Oct 2010, 03:46 PM
 Hi Vlad,

Thanks for the solution. That thing worked like charm except for one thing. My requirement needs a watermark image in the background of chart. To implement that I took the refrence from this  thread. How can I include that watermark image along with the saved image.

Thanks for all your support.

Regards,
Sachin
0
Yavor
Telerik team
answered on 27 Oct 2010, 10:17 AM
Hi sachin,

In order for the background image to appear in the saved image you can use ExportExtentions' method ExportToImage that can export any FrameworkElement as an image. So if you have the following XAML for example:

<Grid Name="printGrid">
    <Border Background="Red" />
    <telerik:RadChart Name="RadChart1" Background="Transparent" />
</Grid>

you can easily export it with these lines of code:

SaveFileDialog dialog = new SaveFileDialog();
dialog.Filter = "PNG File| *.png";
dialog.DefaultExt = "png";
 
if (dialog.ShowDialog() == true)
{
    using (Stream file = dialog.OpenFile())
    {
        Telerik.Windows.Media.Imaging.ExportExtensions.ExportToImage(this.printGrid, file, new Telerik.Windows.Media.Imaging.PngBitmapEncoder());
    }
}

Best wishes,
Yavor Ivanov
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
0
sachin
Top achievements
Rank 1
answered on 29 Oct 2010, 03:19 PM
Hi Vlad,

Thanks for all your support. The save chart image is working good. However the user of my application seems to be adamant about the print. Is there any way I can send the saved image file for print or any other hack/workaround with which I can print the chart or for that matter the whole browser screen using Silverlight 3 Telerik controls?

Thanks,
Sachin
0
Yavor
Telerik team
answered on 03 Nov 2010, 08:56 AM
Hello sachin,

Silverlight 4 introduces the PrintDocument class that makes printing in Silverlight easy. To print the printGrid for example all you have to do is this:

private void printButton_Click(object sender, RoutedEventArgs e)
{
    PrintDocument printDocument = new PrintDocument();
    printDocument.PrintPage += printDocument_PrintPage;
 
    // Open the print dialog.
    printDocument.Print("Rad Chart");
}
 
void printDocument_PrintPage(object sender, PrintPageEventArgs e)
{
    e.PageVisual = this.printGrid;
}

I hope this gets you started properly.

Regards,
Yavor Ivanov
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
0
Phoebe
Top achievements
Rank 1
answered on 11 Jan 2011, 04:12 PM
Hello,

Was the original problem described ever solved? I am having the same issue in which any graph I print that uses HorizontalBarDefinition will not display the data series. However, if I change the defintion to anything else, such as a LineSeriesDefinition, the data series is displayed.

Let me know if there are any fixes or workaround for this. Thanks!
0
Accepted
Yavor
Telerik team
answered on 14 Jan 2011, 11:34 AM
Hello Alessio,

Our developers are aware of this issue and will fix it in a timely manner. The fix will be available in one of the upcoming LIBs, released every Monday.

This problem occurs when you are trying to print RadChart that is not added to the visual tree. Perhaps you can try the solution proposed by Nuno and see if it works for you.

Kind regards,
Yavor Ivanov
the Telerik team
Let us know about your Windows Phone 7 application built with RadControls and we will help you promote it. Learn more>>
0
Gary
Top achievements
Rank 1
answered on 02 Jun 2011, 10:11 PM
Is this issue fixed yet? if I print to windows xps then everything is fine but printing to a physical printer causes lots of problems. Bars and stackbars do not appear, legends docked to the bottom of the chart area disappear, and legends docked to the the right (default) orientation changed from vertical to horizontal. We are currently using assembly version 2011.1.419.1040 Trial.
0
Yavor
Telerik team
answered on 07 Jun 2011, 08:37 AM
Hi Gary,

The approach described in the previous posts should work for all series. I have attached a runnable code that prints a bar chart and an exported xps document. We also tried using a physical printer and the printed image matches the xps one.

If the problem persists, we would ask you to open a formal support ticket and send us a runnable version of your application that we can investigate locally so we can advise you properly how to proceed.

All the best,
Yavor Ivanov
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
0
Gary
Top achievements
Rank 1
answered on 07 Jun 2011, 10:47 PM
Yes, the way I understood it in the previous post. The problem only exist if the charts where not already rendered to the UI. I am trying to print out a report view that we have that has 5 charts. As is the charts will be to big to print to a single page. I have created a printer friendly version of the chart section of my view that is reduced to the fit on a single printed page. This control is only rendered at the time of printing. Something like the following:

void printDocument_PrintPage(object sender, PrintPageEventArgs e)
{
    e.PageVisual = new PrinterFriendlyReportView();
}

As I have said before the works fine with xps only. Physical printers do not print bar charts and the legends are either not populated are the orientation is changed. I will go ahead and open up a support ticket for this with a sample app.
0
Yavor
Telerik team
answered on 10 Jun 2011, 09:07 AM
Hi Gary,

Can you please open a support ticket and upload a sample application that demonstrates the issue so that we can advice you how to proceed.

Greetings,
Yavor Ivanov
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
0
Gary
Top achievements
Rank 1
answered on 10 Jun 2011, 04:44 PM
I have already open a support ticket for this issue. (432108)
0
Yavor
Telerik team
answered on 13 Jun 2011, 09:42 AM
Hi Gary,

Please take a look at your support ticket. We have provided a possible solution there.

Kind regards,
Yavor Ivanov
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
0
Christian
Top achievements
Rank 1
answered on 09 Dec 2011, 10:17 AM
Hi,

I had the same problem with a HorizontalBarSeries.
I fixed it by Setting Opacity on PART_MainContainer to 1 and ScaleX on

PART_AnimationTransform to 1.


<Style
       x:Key="{telerikControls:ThemeResourceKey ThemeType=
       external:SummerThemeExternal , ElementType=telerikCharting:HorizontalBar}"
        
       TargetType="telerikCharting:HorizontalBar">
       <Setter Property="Template" >
           <Setter.Value>
               <ControlTemplate TargetType="telerikCharting:HorizontalBar">
                   <Canvas Opacity="0" x:Name="PART_MainContainer">
                       <Rectangle x:Name="PART_DefiningGeometry"
                              Height="{TemplateBinding ItemActualHeight}"
                              Width="{TemplateBinding ItemActualWidth}"
                              Style="{TemplateBinding ItemStyle}"
                              RadiusX="{StaticResource BarRadiusX}"
                              RadiusY="{StaticResource BarRadiusY}" />
                       <Rectangle Height="{TemplateBinding ItemActualHeight}"
                              Width="{TemplateBinding ItemActualWidth}"
                              RadiusX="{StaticResource BarRadiusX}"
                              RadiusY="{StaticResource BarRadiusY}"
                              OpacityMask="{StaticResource BarOpacityMaskReversedBrush}"
                              Fill="{StaticResource BarMaskReversedBrush}"
                              Stroke="{StaticResource BarMaskReversedStroke}"
                              StrokeThickness="{StaticResource BarMaskStrokeThickness}" />
                       <Rectangle x:Name="PART_SelectedState"
                                  Height="{TemplateBinding ItemActualHeight}"
                                  Width="{TemplateBinding ItemActualWidth}"
                                  RadiusX="{StaticResource BarRadiusX}"
                                  RadiusY="{StaticResource BarRadiusY}"
                                  Fill="{StaticResource BarTopMaskReversedBrush}" />
                       <Canvas.RenderTransform>
                           <ScaleTransform x:Name="PART_AnimationTransform" ScaleX="0"  />
                       </Canvas.RenderTransform>
                        
                   </Canvas>
               </ControlTemplate>
           </Setter.Value>
       </Setter>
   </Style>



0
Christian
Top achievements
Rank 1
answered on 09 Dec 2011, 10:18 AM
Hi,

I had the same problem with a HorizontalBarSeries.
I fixed it by Setting Opacity on PART_MainContainer to 1 and ScaleX on

PART_AnimationTransform to 1.


<Style
       x:Key="{telerikControls:ThemeResourceKey ThemeType=
       external:SummerThemeExternal , ElementType=telerikCharting:HorizontalBar}"
        
       TargetType="telerikCharting:HorizontalBar">
       <Setter Property="Template" >
           <Setter.Value>
               <ControlTemplate TargetType="telerikCharting:HorizontalBar">
                   <Canvas Opacity="0" x:Name="PART_MainContainer">
                       <Rectangle x:Name="PART_DefiningGeometry"
                              Height="{TemplateBinding ItemActualHeight}"
                              Width="{TemplateBinding ItemActualWidth}"
                              Style="{TemplateBinding ItemStyle}"
                              RadiusX="{StaticResource BarRadiusX}"
                              RadiusY="{StaticResource BarRadiusY}" />
                       <Rectangle Height="{TemplateBinding ItemActualHeight}"
                              Width="{TemplateBinding ItemActualWidth}"
                              RadiusX="{StaticResource BarRadiusX}"
                              RadiusY="{StaticResource BarRadiusY}"
                              OpacityMask="{StaticResource BarOpacityMaskReversedBrush}"
                              Fill="{StaticResource BarMaskReversedBrush}"
                              Stroke="{StaticResource BarMaskReversedStroke}"
                              StrokeThickness="{StaticResource BarMaskStrokeThickness}" />
                       <Rectangle x:Name="PART_SelectedState"
                                  Height="{TemplateBinding ItemActualHeight}"
                                  Width="{TemplateBinding ItemActualWidth}"
                                  RadiusX="{StaticResource BarRadiusX}"
                                  RadiusY="{StaticResource BarRadiusY}"
                                  Fill="{StaticResource BarTopMaskReversedBrush}" />
                       <Canvas.RenderTransform>
                           <ScaleTransform x:Name="PART_AnimationTransform" ScaleX="0"  />
                       </Canvas.RenderTransform>
                        
                   </Canvas>
               </ControlTemplate>
           </Setter.Value>
       </Setter>
   </Style>



Tags
Chart
Asked by
Alessio
Top achievements
Rank 1
Answers by
Alessio
Top achievements
Rank 1
Nikolay
Telerik team
Nuno
Top achievements
Rank 1
sachin
Top achievements
Rank 1
Vlad
Telerik team
Yavor
Telerik team
Phoebe
Top achievements
Rank 1
Gary
Top achievements
Rank 1
Gary
Top achievements
Rank 1
Christian
Top achievements
Rank 1
Share this question
or