Change color and series type from a Combination Chart Visualization

This example demonstrates how to read and write the properties of a combination chart series types and colors. For this example we need 3 document properties and 3 scripts for each document property so when the document property changes, the script is triggered. Each script demonstrate how to read and write the type or color for a specific serie.

Each document property can be linked to a Spotfire "Drop-down list" Property Control. You can do this by creating and editing a text area.:

• category: used in the first dropdown to select the category from the series
• color : to change the color of the selected serie
• type: to change from line or bar

category : Reads the combination chart series type and color
For the category dropdown, we want to add the names that matches the output from the Series by selector. In other words, the values that appear in the series. If you are not using any custom expression, you can set the category property  from the unique values of the column used in the series by selector.  In the above example is [Fruit] and the following script to read the visualization series properties



and the script that triggers when the category property changes, reads the visualization series type for each category and it's color:

from Spotfire.Dxp.Application.Visuals import CombinationChart, CategoryKey

# cast visual to combo chart
combinationChart = vis.As[CombinationChart]()

# gets the category series type (bar|line)
category = CategoryKey(Document.Properties["category"])
Document.Properties["type"]  = str(combinationChart.IndexedSeriesType[category])

# gets the color and updates color dp
import re
color = str(combinationChart.ColorAxis.Coloring.GetColorForCategory(category))
color = re.findall(r"\[([^\[\]]+)\]", color)[0]
Document.Properties["color"] = color.lower()

color: sets the color for the specified category series
For the color, you can set the property value through a list of named colors either by entering them manually or by selecting the unique values from a column in case you have these values on a separate table.  You can also add a color picker with JavaScript for enhanced the user experience. 

 

from Spotfire.Dxp.Application.Visuals import CombinationChart, CategoryKey
from System.Drawing import Color

#cast visual to combo chart
combinationChart = vis.As[CombinationChart]()

#get script parameters from doc props
category = CategoryKey(Document.Properties["category"]) #string representing a category from the series
color = Color.FromName(Document.Properties["color"]) #named color such as blue, green, magenta, beige...
#color = Color.FromArgb(255,0,0) #if you know the rgb values
#color = Color.FromArgb(int(hex_color[1:3], 16), int(hex_color[3:5], 16), int(hex_color[5:7], 16)) #if hex_color comes from a color picker


# change the color for the corresponding category
combinationChart.ColorAxis.Coloring.SetColorForCategory(category,color)

If you want to spice up your color picker, you can use the JavaScript Color Picker for Spotfire to achieve something like this:
 

type: changes the series type (line or bar) for the corresponding series category
This can be a switch, dropdown, checkbox or whatever interface you want to use. At the end, you need to hold a value for the script logic

from Spotfire.Dxp.Application.Visuals import CombinationChart, CombinationChartSeriesType, CategoryKey

#cast visual to combo chart
combinationChart = vis.As[CombinationChart]()

#get script parameters from doc props
category = CategoryKey(Document.Properties["category"]) #string representing a category from the series
type = CombinationChartSeriesType.Bar if Document.Properties["type"] == "Bar" else CombinationChartSeriesType.Line 


# change series type as Bar or line
combinationChart.IndexedSeriesType[category] = type