@domoinc/ca-stats-center-icon v3.0.2

CAStatsCenterIcon

Configuration Options

animationDuration

Type: number
Default: 1000

Duration of the all animations

chartColor

Type: color
Default: "#73B0D7"

Color that will be used for the chart

chartName

Type: string
Default: "CAStatsCenterIcon"

Name of chart for reporting

circleStrokeWidth

Type: number
Default: 2
Units: px

undefined

dashedStrokeWidth

Type: number
Default: 1
Units: px

undefined

height

Type: undefined
Default: 400

undefined

isOnMobile

Type: boolean
Default: false

If true, it signals to the widget that it is running on a mobile device. Should be called before draw and then NEVER changed.

labelTextColor

Type: color
Default: "#888888"

Color for chart labels

shouldValidate

Type: boolean
Default: true

Flag for turning off data validation

textFontFamily

Type: string
Default: "Open Sans"

textFontWeight

Type: select
Default: {"name":"400 - Regular","value":400}

Font weight of labels and values text

updateSizeableConfigs

Type: boolean
Default: true

Flag for turning off the mimic of illustrator's scale functionality

valueTextColor

Type: color
Default: "#73B0D7"

Text color of the number values

width

Type: undefined
Default: 400

undefined

Data Definition

Label

Type: string

Default validate:

function (d) { return this.accessor(d) !== undefined; }

Default accessor:

function (line) { return line[0] === undefined ? undefined : String(line[0]); }

Value

Type: number

Default validate:

function (d) { return !isNaN(this.accessor(d)); }

Default accessor:

function (line) { return parseFloat(line[1]); }

Events

Dispatch Events

External Events

Example

//Setup some fake data
var data = [
	['NORTH',   100],
	['SOUTH',   200],
	['EAST',    300],
	['WEST',    400]
];

var aHeight = 400;
var aWidth = 400;

//Initialze the widget
var chart = d3.select("#vis")
	.select('svg')
	.select('[id^=DomoWidgetLockDomo]')
	.attr('transform', 'translate(50,50)')
	.chart("CAStatsCenterIcon")
	.c({
		width: aWidth,
		height: aHeight,
	});

//Render the chart with data
chart._notifier.showMessage(true);
chart.draw(data);