Colors in Charts

The R function ChartColors in the flipChartBasics package is used to create a vector of colors that are then used by charts.

This function is called after processing the data to determine the number of colors required. Its output is a vector of strings, each prefixed by # and representing a color in hexadecimal RGB format. The vector is passed to the charting function.

The key inputs are:

• number.colors.needed
• given.colors is a string representing a color palette (e.g. Strong colors) or one of Custom color, Custom gradient or Custom palette.
• custom.color is required if Custom color is specified is a hexadecimal representation of the color such as #5C9AD3.
• custom.gradient.start and custom.gradient.end are required if Custom gradient is specified. The resulting vector is interpolated between these colors.
• custom.palette is required if Custom palette is specified and allows the user to provide a vector of specific colors.

The following JavaScript code is an example of how to create GUI controls for colors including the use of color pickers:

form.setHeading("ChartColors");

form.numericUpDown({name: "formNumber", label: "Up down", minimum: 0})

var colOpt = form.comboBox({name: "formPalette", label: "Color palette", alternatives: ["Default colors", "Primary colors", "Rainbow", "Light pastels", "Strong colors",
     "Reds, dark to light", "Reds, light to dark", "Greens, dark to light", "Greens, light to dark", "Blues, dark to light", "Blues, light to dark", "Greys, dark to light", "Greys, light to dark",
     "Heat colors (red, yellow, white)", "Terrain colors (green, beige, grey)", "Custom color", "Custom gradient", "Custom palette"], default_value: "Default colors", required: true});
if (colOpt.getValue() == "Custom color")
    form.colorPicker({name: "formCustomColor", label: "Custom color", default_value: "#5C9AD3"});
if (colOpt.getValue() == "Custom gradient")
{
    form.colorPicker({name: "formCustomGradientStart", label: "Gradient start", default_value: "#5C9AD3"});
    form.colorPicker({name: "formCustomGradientEnd", label: "Gradient end", default_value: "#ED7D31"});
}
if (colOpt.getValue() == "Custom palette")
    form.textBox({name: "formCustomPalette", label: "Custom palette", default_value: "#5C9AD3, #ED7D31", prompt: "Enter color as a string. Multiple values should be separated by commas."});

The R code to create the color is vector is as follows:

library(flipChartBasics)

color.vector <- ChartColors(formNumber,
                            given.colors = formPalette,
                            custom.color = if (exists("formCustomColor")) formCustomColor else NULL,
                            custom.gradient.start = if (exists("formCustomGradientStart")) formCustomGradientStart else NULL,
                            custom.gradient.end = if (exists("formCustomGradientEnd")) formCustomGradientEnd else NULL,
                            custom.palette = if (exists("formCustomPalette")) formCustomPalette else NULL)