DataVisualizer.Visuals

Syntax

Visuals: Object

Description

The Visuals property sets and gets settings of mapping data series values with chart axes, color and size of chart elements.

Comments

Use JSON or the setVisuals method to set the property value, and the getVisuals method to get the property value.

The property contains a JSON object with the following fields of the PP.CoordinateVisual type: X, Y, R and Color.

Example

To execute the example, the HTML page must contain the BubbleChart component named bubbleChart (see Example of Creating the BubbleChart Component). Change colors array for the scale of bubble chart data mapping:

// Determine colors array
var colorScale = new PP.ScaleBase({
    Items: "#00ff00 #30cf00 #708f00 #b04f00 #f00f00",
    NoData: "#AFBFBF",
    TypeArguments: "Brush"
});
// Get settings of data mapping
var visuals = bubbleChart.getVisuals();
// Get get a set of bubble chart scale colors
var colorItems = visuals.Color.getColorMapping().getScale().getItems();
// Change scale colors
for (var i in colorItems) {
    colorItems[i].setColor(colorScale.getItems()[i].getColor());
};
// Determine settings of data mapping
bubbleChart.setVisuals(visuals);
// Refresh bubble chart
bubbleChart.refresh();

As a result of executing the example, bubble colors in the scale of bubble chart data mapping are changed:

See also:

DataVisualizer