We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How can we display the percentage values in the Value Cell Block using ValueCellStyle in OlapGrid Control

It is possible to show the values of the OlapGrid in the form of Percentage. This can be achieved by customizing the Value Cells of the OlapGrid using ValueCellStyle. A style for each value cell has been added which uses a converter to convert the values of the OlapGrid as a Percentage values and this style has been applied to all value cells in the OlapGrid Control.

  1. Add a “Button” in the Designer page to Apply or Remove the Percentage values in the OlapGrid.
  2. Add the below style in MainPage.xaml and Converter to convert as Percentage values in MainPage.xaml.cs.

XAML

 

C#

 

   public class PercentageConverter : IValueConverter

    {

        #region IValueConverter Members

 

        

        public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)

        {

            PivotCellDescriptor cellInfo = value as PivotCellDescriptor;

            if (cellInfo != null)

            {

                if (total == 0d)

                {

                    //find whole total for the table.

                    var lastPivot = cellInfo.Engine.TableColumns.Last();

                    total = lastPivot.Cells.Last().DoubleValue;

                }

 

                var percentage = cellInfo.DoubleValue * 100d / total;

                return string.Format("{0}%", Math.Round(percentage, 2));

            }

 

            return string.Format("{0}%", total);

        }

 

 

        public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)

        {

            throw new NotImplementedException();

        }

 

        #endregion

    }

 

  1. Add the below code snippet in the button click event for adding and removing the Percentage style.

C#

 

  private void Button_Click(object sender, RoutedEventArgs e)

{

            ToggleButton tgle = sender as ToggleButton;

            if (tgle.IsChecked.HasValue && tgle.IsChecked.Value)

            {

                tgle.Content = "Remove Percentage Style";

                this.olapGrid.ValueCellStyle = new OlapGridCellStyle { Style = this.Resources["valueCellStyle"] as Style, Background = new SolidColorBrush(Colors.Red), Foreground = new SolidColorBrush(Colors.White) };

                 this.olapGrid.DataBind(); //Changing the data context instead applying only styles

            }

            else

            {

                tgle.Content = "Apply Percentage Style";

                this.olapGrid.ValueCellStyle = new OlapGridCellStyle() { Style = null, Background = new SolidColorBrush(Colors.Red), Foreground = new SolidColorBrush(Colors.White) };

                this.olapGrid.DataBind();

            }

}

 

 

Figure: OlapGrid with Percentage style for Value cells

 

 

                Figure: OlapGrid without Percentage style for Value cells

 

Article ID: Published Date: Last Revised Date: Platform: Control:
2764 11/21/2014 11/25/2014 Silverlight OlapClient
Tags:
Did you find this information helpful?
Add Comment
You must log in to leave a comment

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon