@domoinc/ca-icon-trends-with-text

Configuration Options

animationDuration

Type: number
Default: 2000
Units: ms
The duration of the line animation in ms.

chartName

Type: string
Default: "CAIconTrendsWithText"
Name of chart for Reporting.

drawFromCenter

Type: boolean
Default: true
Draws line chart from center of its height box

endPointRadius

Type: number
Default: 3
Units: px
Radius of the point at the end of the sparkline.

generalFillBadColor

Type: color
Default: "#E4584F"
Color meant to indicate the line is going down.

generalFillGoodColor

Type: color
Default: "#80C25D"
Color meant to indicate the line is going up.

generalStrokeBadColor

Type: color
Default: "#C92E25"
Stroke color meant to indicate the line is going down.

generalStrokeGoodColor

Type: color
Default: "#559E38"
Stroke color meant to indicate the line is going up.

height

Type: number
Default: 250
Height of the chart.

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.

lineWidth

Type: number
Default: 2
Units: px
Thickness of the sparkline

shouldValidate

Type: boolean
Default: true
Flag for turning off data validation

updateSizeableConfigs

Type: boolean
Default: true
Flag for turning off the mimic of illustrator's scale functionality

width

Type: number
Default: 250
Width of the chart.

Data Definition

Date

Type: date
Default validate:

function (d) {
	          return new Date(this.accessor(d)) !== 'Invalid Date';
	        }

Default accessor:

function (line) {
	          return 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

```js
//Setup some fake data var data = "2014-01-01", 44.0234, "2014-02-01", 40.2131, "2014-03-01", 25.4532, "2014-04-01", 53.0385, "2014-05-01", 44.2341, "2014-06-01", 40.4543, "2014-07-01", 30.3234, "2014-08-01", 44.2342, "2014-09-01", 40.3423, "2014-10-01", 56.4232 ;
//Initialze the widget var container = d3.select('#vis');
var bBox = container.select("id^=chartBounds") .node() .getBBox();
var gWidgetGroup = container.select("id^=DomoWidgetLockDomo");
// Transform our chart's container to fit where the user placed the wiget gWidgetGroup.attr("transform", "translate(" + bBox.x + "," + bBox.y + ")") .selectAll("") .remove();
var chart = gWidgetGroup .chart('CAIconTrendsWithText') .c({

width: bBox.width,
height: bBox.height

});
//Render the chart with data chart.notifier.showMessage(true); chart.draw(data);
// setTimeout(function () { chart.draw();}, 10000);
```