Marker: PP.Ui.SizeLegendMarkerShape;
The Marker property determines shape of legend markers.
Use JSON or the setMarker method to set the property value, and the getMarker method to get the property value.
To execute the example, the HTML page must contain the component named bubbleChart (see BubbleChart component named bubbleChart (see Example of Creating the BubbleChart Component). Change the following properties of size legend: marker shape, marker border width, color, spacing between markers, spacing between text and markers. Set maximum and minimum radius and values for markers, define format of maximum and minimum values:
// Get size legend var legend = bubbleChart.getSizeLegend(); // Set square shape for legend markers legend.setMarker(PP.Ui.SizeLegendMarkerShape.Rectangle); // Set new value of marker border width legend.setMarkerBorderThickness(5); // Set new marker color var color = new PP.Color(0, 100, 255); legend.setMarkerColor(color); // Set spacing between markers legend.setMarkerSpacing(200); // Set maximum marker radius legend.setMaxRadius(40); // Set minimum marker radius legend.setMinRadius(20); // Set maximum marker value legend.setMaxValue(2000); // Set minimum marker value legend.setMinValue(1000); // Set record format of maximum marker value legend.setMaxValueFormat("{0:0}") // Set record format of minimum marker value legend.setMinValueFormat("{0:0.0000}") // Set new value for spacing between text and marker legend.setTextSpacing(15); // Refresh chart bubbleChart.refresh();
After executing the example the following properties of size legend are changes: marker shape, marker border width, color, spacing between markers, spacing between text and markers. New minimum and maximum marker radii and marker values are set, format of maximum and minimum marker values is defined:
See also: