Formatting Cells in the Data Area
Conditional Filling
Explore the Cell
Placing images into cells

Setting the cell appearance in the RIA controls is possible through writing the DrawCell event handler. This event is called upon filling the cellset for each cell of the Grid, and allows changing the font color, the text displayed in the cell, as well as specifying the method of background filling (either solid or set gradient).

In this event handler, you can also assing any tooltip for the cell.

Below we'll discuss a few examples of realizing this event handlers.

Formatting Cells in the Data Area

Objective: to format the Grid cells contents:

We need to format the cells in the "Sales Amount" measure as currency values, and "Order Count" as group-delimited integers, using German regional settings. To do that we'll use the following event handler:

protected void RiaOLAPGrid1_DrawCell( object sender, DrawCellEventArgs e)
{
    IDataCell dc = e.Cell as IDataCell;
    if ((dc != null ) && (dc.Data != null ))
    {   
        if ((dc.Address.Measure != null ) && (dc.Address.Measure.DisplayName == "Sales Amount" ))
        {
            e.Text = Convert.ToDecimal(dc.Data).ToString( "c" , new CultureInfo( "de-DE" ).NumberFormat);
        }
        if ((dc.Address.Measure != null ) && (dc.Address.Measure.DisplayName == "Order Count" ))
        {
            e.Text = Convert.ToDecimal(dc.Data).ToString( "n0" , new CultureInfo( "de-DE" ).NumberFormat);
        }
    }
}

The Grid then will look like this:

Conditional Filling

Objective: to mark the data cells with values below 1,000,000:

To do that, we’ll assign the gradient background filling of these cells. The following code will do:

protected void RiaOLAPGrid1_DrawCell(object sender, DrawCellEventArgs e)
{
    IDataCell dc = e.Cell as IDataCell;
    if ((dc != null) && (dc.Data != null))
    {
        if (Convert.ToDouble(dc.Data) < 1000000)
        {
            GradientColorBrush gb = new GradientColorBrush(new PointF(0, 0.5f), new PointF(1, 0.5f));
            ColorStop cs = new ColorStop(Color.Wheat, 0);
            gb.Stops.Add(cs);
            cs = new ColorStop(Color.RosyBrown, 0.5);
            gb.Stops.Add(cs);
            cs = new ColorStop(Color.Wheat, 1);
            gb.Stops.Add(cs);
            e.Background = gb;
        }
    }
}

The Grid then will look like this:

Explore the Cell

Objective: to assign each data cell a tooltip, describing its position in the multi-dimensional Cube.

To do that, we’ll apply to the appropriate fields and methods of the IDataCell.Address interface that represents the address of the specified cell. From here, we’ll get the string containing information about the determined levels and measures of the specified cell, and assign this string to the DrawCellEventArgs.Tooltip property.
The following code will do:

protected void RiaOLAPGrid1_DrawCell(object sender, DrawCellEventArgs e)
{
    if (e.Cell.CellType == TCellType.ctData)
    {
        StringBuilder sb = new StringBuilder();
        IDataCell D = (IDataCell)e.Cell;
        if (D.Address.Measure != null)
        {
            sb.Append("Measure: " + D.Address.Measure.DisplayName);
        }
        for (int i = 0; i < D.Address.LevelsCount; i++)
        {
            sb.AppendLine();
            sb.Append(D.Address.Levels(i).DisplayName +
            ": " + D.Address.Members(i).DisplayName);
        }
        e.Tooltip = sb.ToString();
    }
}

Now, by moving the cursor over the data cell, we’ll get a picture like this:

Placing images into cells

Aim: to place images into cells to visualize data
To place an image into a cell, you need to assign the Url of this image to the DrawCellEventArgs.ImageUri property.

You can also amend the position of the image in relation to the text in the cell through the DrawCellEventArgs.ImagePosition property.

protected void RiaOLAPGrid1_DrawCell(object sender, DrawCellEventArgs e)
{
    if (e.Cell.CellType == TCellType.ctMember)
    {
        e.ImageUri = "http://localhost/OLAPDemoASP/Images/Example/" + s + ".png";
        e.ImagePosition = ImagePosition.ipTopOnText;
    }
}

As a result, the Grid should look like this: