Days
Day 0
1900Day 1
940Day 2
520Day 3
190Day 4
80Day 5
50Day 6
110Day 7
2022-05-2016
200
160
90
30
40
10
20
20
23-05-2016
300
200
150
50
20
20
90
24-05-2016
200
110
150
50
10
20
25-05-2016
200
120
60
30
10
26-05-2016
300
90
40
30
27-05-2016
200
80
30
28-05-2016
300
180
29-05-2016
200
Retention graph (Cohort analysis Graph)
Cohort Analysis Graph
Live Demo
New Library without any external dependencies and handling only visual layer without controls for data
Usage:
-
install
npm install --save cohort-graph
-
usage
var cohortGraph = new CohortGraph(element, data, options);
Working on options
React Version of same Graph
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
Outdated Library - found in folder old with options for controls
Input options:
{
"data": {
"days": {
"22-05-2016": [
200,
10,
20,
30,
40,
10,
20,
20
],
"23-05-2016": [
300,
200,
150,
50,
20,
20,
90,
100
],
"24-05-2016": [
200,
110,
150,
50,
10,
20,
30,
40
],
"25-05-2016": [
100,
10,
10,
50,
20,
20,
60,
0
]
},
"weeks": {
"week1": [
200,
10,
20,
30,
40,
10,
20,
20
],
"week2": [
300,
200,
150,
50,
20,
20,
90,
100
],
"week3": [
200,
110,
150,
50,
10,
20,
30,
40
]
},
"months": {
"month1": [
200,
10,
20,
30,
40,
10,
20,
20
],
"month2": [
300,
200,
150,
50,
20,
20,
90,
100
],
"month3": [
200,
110,
150,
50,
10,
20,
30,
40
],
"month4": [
100,
10,
10,
50,
20,
20,
60,
0
]
}
},
"startDate": "22-05-2016",
"endDate": "25-05-2016",
"inputDateFormat": "DD-MM-YYYY",
"dateDisplayFormat": "MMM DD YYYY",
"title": "Retention Analysis",
"showEmptyDataMessage": true,
"customEmptyDataMessage": null,
"enableInactive": false,
"retentionDays": 7,
"retentionWeeks": 4,
"retentionMonths": 3,
"enableTooltip": true,
"enableDateRange": false,
"showAbsolute": false,
"toggleValues": true,
"showHeaderValues": false,
"cellClickEvent" : function(date, day){
/* your closure with date=" + date + "&day="+ day; */
},
"dayClickEvent" : function(day, startDate, endDate){
/* do something with day#, startDate and endDate */
}
}
Release Notes
v0.5.6: - Most of the issues fixed, Especially column header percentages.