DateValueTable
Table with date and value.
Configuration Options
chartName
Type: string
Default: "DateValueTable"
Name of chart for Reporting
chartPrimarySeriesColors
Type: colorArray
Default: [["#D9EBFD","#B7DAF5","#90c4e4","#73B0D7","#4E8CBA","#31689B"],["#DDF4BA","#BBE491","#A0D771","#80C25D","#559E38","#387B26"],["#FDECAD","#FCCF84","#FBAD56","#FB8D34","#E45621","#A43724"],["#F3E4FE","#DDC8EF","#C5ACDE","#B391CA","#8F6DC0","#7940A1"],["#FCD7E6","#FBB6DD","#F395CD","#EE76BF","#CF51AC","#A62A92"],["#D8F4DE","#ABE4CA","#8DD5BE","#68BEA8","#46998A","#227872"],["#FDDDDD","#FCBCB7","#FD9A93","#FD7F76","#e45850","#c92e25"]]
The primary colors used to represent series data
dataDateFormat
Type: string
Default: "YYYY-MM-DD"
Format of the date coming into this widget
dateFormatString
Type: string
Default: "M/D/YY"
Moment date format string. Formats the date shown in the widget
generalSeparatorColor
Type: color
Default: "#FFFFFF"
Color used to seperate each row
height
Type: number
Default: 250
Units: px
highlightEvenRows
Type: boolean
Default: true
Whether or not to highlight even rows
highlightRowColor
Type: color
Default: "#E4E5E5"
Color used to highlight the even rows
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.
listElementHeight
Type: number
Default: 49
Units: px
Height of each row
prefix
Type: string
Default: ""
Prefix to be preppended to each number in the opps list
rectColorScale
Type: D3 Color Scale
Default: "function scale(x) {\n\t return range[((index.get(x) || (ranger.t === \"range\" ? index.set(x, domain.push(x)) : NaN)) - 1) % range.length];\n\t }"
Color scale for opps list.
shouldValidate
Type: boolean
Default: true
Flag for turning off data validation
showColorRectangles
Type: boolean
Default: true
Whether or not to show the colored rectagles on the left
suffix
Type: string
Default: ""
Suffix to be appended to each number in the opps list
textColor
Type: color
Default: "#333"
textFontFamily
Type: string
Default: "Open Sans"
textSize
Type: number
Default: 12
Units: px
updateSizeableConfigs
Type: boolean
Default: true
Flag for turning off the mimic of illustrator's scale functionality
width
Type: number
Default: 250
Units: px
widthOfColorRect
Type: string
Default: "3px"
Width in px of the color rect
Data Definition
colorVal
Type: number
Default validate:
function (d) {
return true;
}Default accessor:
function (line) {
return Number(line[0]);
}date
Type: date
Default validate:
function (d) {
return this.accessor(d).isValid();
}Default accessor:
function (line) {
return moment(line[2], _Chart.c('dataDateFormat'));
}name
Type: number
Default validate:
function (d) {
return this.accessor(d) !== 'undefined';
}Default accessor:
function (line) {
return String(line[1]);
}value
Type: number
Default validate:
function (d) {
return !isNaN(this.accessor(d)) && this.accessor(d) >= 0;
}Default accessor:
function (line) {
return Number(line[0]);
}Events
Dispatch Events
dispatch:mouseenter
dispatch:mouseleave
dispatch:click
External Events
Example
//Setup some fake data
var data = [
[35093352, 'Penatibus Et Magnis LLC', '2013-02-16'],
[92566492, 'Nibh PC', '2013-05-21'],
[51286501, 'Sed Sapien Nunc Industries', '2013-07-17'],
[35330031, 'Vitae Inc.', '2013-08-09'],
[62160816, 'In Consequat Inc.', '2014-07-24'],
[64590209, 'Dapibus Quam Quis Inc.', '2015-07-04'],
[63579914, 'Suspendisse Limited', '2013-09-09'],
[69612815, 'Tincidunt Vehicula Risus LLC', '2015-01-17'],
[30614286, 'Ut Associates', '2013-08-30'],
[64491832, 'At Nisi Consulting', '2013-12-29'],
[96720340, 'Neque Institute', '2014-01-10'],
[24292406, 'Quis Diam LLP', '2014-05-06'],
[81762191, 'Lorem Lorem Limited', '2012-12-27'],
[88354350, 'Dictum Incorporated', '2015-06-04'],
[65870659, 'Et Inc.', '2015-02-26'],
[2646160, 'Nec LLP', '2015-07-10'],
[5582920, 'Cum Sociis Industries', '2014-04-27'],
[34009406, 'Curabitur Massa Vestibulum Corporation', '2013-07-24'],
[26810754, 'Mauris Ut Quam LLC', '2012-10-14'],
[51282633, 'Iaculis Enim Incorporated', '2014-03-19'],
[86248859, 'Vel Turpis Industries', '2015-01-23'],
[50957387, 'Mi Duis Risus LLC', '2013-02-17'],
[73909039, 'Aliquet Metus Urna Corp.', '2012-10-25'],
[73892326, 'Sit Amet Faucibus Corporation', '2014-10-07'],
[3738917, 'Ultrices A Corp.', '2015-12-20'],
[31999414, 'Ac Mattis Ltd', '2015-01-22'],
[9341020, 'Ut Eros PC', '2014-12-14'],
[6999734, 'Mattis Velit Justo Company', '2013-08-07'],
[81822094, 'Quisque Industries', '2015-11-25'],
[72191742, 'Erat Vivamus Limited', '2014-04-26'],
[39684938, 'Aliquam Nec PC', '2015-01-30'],
[94432739, 'Sit Inc.', '2014-02-15'],
[9729174, 'Mi LLC', '2014-12-24'],
[25008252, 'Dictum Placerat Augue Inc.', '2013-08-26'],
[28878570, 'Arcu Ac LLC', '2013-10-30'],
[62056201, 'Magna Lorem Industries', '2013-01-03'],
[9603077, 'Molestie Tortor LLP', '2015-01-19'],
[77791857, 'Proin Ultrices Corp.', '2014-11-21'],
[8720376, 'Eget Limited', '2014-08-12'],
[21576852, 'Mauris Vel Industries', '2013-10-15'],
[53217179, 'Massa Rutrum Magna Ltd', '2012-11-18'],
[60848851, 'Cum Sociis Corp.', '2015-04-19'],
[56306327, 'Cursus Consulting', '2014-04-01'],
[20530273, 'Et Industries', '2014-03-26'],
[6317174, 'Dui Ltd', '2013-03-01'],
[54896784, 'Faucibus Id Libero Inc.', '2013-08-01']
];
//Initialze the widget
var chart = d3.select('#vis')
.append('svg')
.attr({
x: 0,
y: 0,
height: '500px',
width: '500px'
})
.append('g')
.attr('transform', 'translate(' + 10 + ',' + 10 + ')')
.chart('DateValueTable')
.c({
width: 480,
height: 480,
prefix: '$',
textFontFamily: 'Open Sans',
textSize: 12,
textColor: 'black'
});
//Render the chart with data
chart._notifier.showMessage(true);
chart.draw(data);
// setTimeout(function(){chart.c('showColorRectangles', false); chart.draw(data);},1000)