Dark color schemes with ILPanel

I recently got a request for help in building an application, where ILPanel was supposed to create some plots with a dark background area. Dark color schemes are very popular in some industrial domains and ILNumerics’ ILPanel gives the full flexibility for supporting dark colors. Here comes a simple example:

And here comes the code used to create this example:

private void ilPanel1_Load(object sender, EventArgs e) {
    // create some test data
    ILArray<float> A = ILSpecialData.torus(1.3f, 0.6f);

    // create the plot: a simple surface
    ilPanel1.Scene.Add(new ILPlotCube(twoDMode: false) {
        new ILSurface(A, colormap: Colormaps.Summer) {
            // we also want a colorbar
            new ILColorbar() {
                Background = {
                    Color = Color.DarkGray
                }
            }
        }
    });

    // set the backcolor of the scene to black
    ilPanel1.BackColor = Color.Black; 

    // set labels color
    foreach (var label in ilPanel1.Scene.Find<ILLabel>()) {
        label.Color = Color.White;
        label.Fringe.Width = 0;
    }

    // set the color of the default labels for axis ticks
    foreach (var axis in ilPanel1.Scene.Find<ILAxis>()) {
        axis.Ticks.DefaultLabel.Color = Color.White;
        axis.Ticks.DefaultLabel.Fringe.Width = 0;
    }

    // some more configuration: the view limits
    ilPanel1.Scene.First<ILPlotCube>().Limits.Set(
        new Vector3(0, 0, 1), new Vector3(2, 2, -1));

}

In line 4 we use the ILSpecialData class to create some test data. torus() creates the X, Y and Z values which eventually assemble a torus when used in ILSurface. The next line creates and adds a new plot cube to the scene. We set its two2Mode property to false, so we can rotate the torus with the mouse.

The next line creates a new surface and provides the torus data to it. As colormap ‘Colormaps.Summer’ is configured. Most surfaces need a colorbar in order to help mapping colors to actual values. We add a new colorbar below the surface and set its background color to some dark value.

Next, the BackColor of the main panel is set to black. Note, that setting the background color of a panel must be done in code in the current version (3.3.3). This is due to a bug in ILPanel which causes settings made in the designer to be ignored!

Now we have a dark background color but the labels still remain black. So let’s fix this: all labels which are part of the regular scene graph can easily be set at once. We simply use the ILGroup.Find() function to enumerate all labels and set their color to white. Also, we remove the fringe around them. Alternatively we could have set the fringe color to some dark color.

The last issue remaining is caused by the fact that labels for ticks cannot be configured here. The reason is, that tick labels are created dynamically. they don’t even exist at the time of execution of this code. So we must configure a thing called ‘DefaultLabel‘ instead. DefaultLabel is a member of the ticks collection of every axis object and used at runtime to provide default properties for all tick labels in auto mode.

This gives a nice dark color scheme. Keep in mind that the default color values for all scene-/plot objects are currently optimized for light background colors. Using dark backgrounds, therefore requires one to adjust the color on all plot objects accordingly.