FlexChart | ComponentOne
FlexChart / Working with FlexChart / Export / Export to Image
In This Topic
    Export to Image
    In This Topic

    FlexChart for WPF allows you to export the chart to multiple image formats. The supported formats are PNG, JPEG, BMP and SVG.

    To export a FlexChart to an image format, use SaveImage method. The method saves the chart as an image to the specified stream in the given ImageFormat. You can optionally specify the height, width, and back color of the image to be saved.

    This topic uses the sample created in QuickStart topic to explain the implementation for exporting a FlexChart to an image on button click event.

    The following image shows a chart with a button to be clicked to export chart to a desired image format.

    MainWindow.xaml
    Copy Code
    <Grid>
            <c1:C1FlexChart x:Name="flexChart" 
                   BindingX="Country" 
                   Height="200"
                   Width="500"
                ItemsSource="{Binding DataContext.Data}">
                <c1:C1FlexChart.Series>
                    <c1:Series SeriesName="Sales" 
                           Binding="Sales"/>
                    <c1:Series SeriesName="Expenses" 
                           Binding="Expenses"/>
                </c1:C1FlexChart.Series>
            </c1:C1FlexChart>
            <Button Content="Export FlexChart" Height="30" Width="40" Click="OnSaveButtonClick" Margin="0,0,412,269" />
    </Grid>                                                       
    
    MainWindow.xaml.cs
    Copy Code
    public partial class MainWindow : Window
        {
            private List _data;
            public MainWindow()
            {
                InitializeComponent();
            }
            public List Data
            {
                get
                {
                    if (_data == null)
                    {
                        _data = DateCreator.CreateData();
                    }
    
                    return _data;
                }
            }
    
            private void OnSaveButtonClick(object sender, RoutedEventArgs e)
            {
                var dialog = new SaveFileDialog()
                {
                    Filter = "PNG|*.png|JPEG |*.jpeg|BMP|*.bmp|SVG|*.svg"
                };
                if (dialog.ShowDialog() == true)
                {
                    using (Stream stream = dialog.OpenFile())
                    {
                        var extension = dialog.SafeFileName.Split('.')[1];
                        ImageFormat fmt = (ImageFormat)Enum.Parse(typeof(ImageFormat), extension, true);
                        flexChart.SaveImage(stream, fmt);
                    }
                }
            }
        }