GraphUp Demo 1 · Fill

The demo tables below could represent the average visitor count to your website split up per day and hour. In the first table, the greenPower color map is used. Also, using the callBeforePaint callback we assign a special CSS class for all cells above 50%.

	Monday	Tuesday	Wednesday	Thursday	Friday	Saturday	Sunday
00:00–02:00	1554	2067	575	2865	2723	1450	4236
02:00–04:00	649	230	192	483	96	1120	393
04:00–06:00	207	1853	151	237	1242	171	1327
06:00–08:00	1101	515	688	315	179	1164	802
08:00–10:00	2649	2580	2322	2013	3615	3965	2176
10:00–12:00	2453	2236	3855	3338	4202	3530	2684
12:00–14:00	1684	1467	1386	1732	3374	2319	2171
14:00–16:00	1021	2792	1251	3374	1799	1018	1085
16:00–18:00	1070	2289	1888	1691	3529	2005	1089
18:00–20:00	3405	4168	4193	4485	4440	5532	3647
20:00–22:00	3697	4704	3477	5041	5350	4804	5041
22:00–24:00	1686	3543	1483	3934	2488	3291	2398

Obviously, in the next table another color map has been used: burn. There is more going on, though. Via the callBeforePaint callback we customize the opacity of each cell's text, according to its percentage. This creates a nice extra visual effect.

	Monday	Tuesday	Wednesday	Thursday	Friday	Saturday	Sunday
00:00–02:00	2649	321	2681	1172	477	1329	875
02:00–04:00	677	1080	452	908	449	371	292
04:00–06:00	945	1429	256	221	664	953	602
06:00–08:00	590	1297	767	347	160	576	1172
08:00–10:00	2675	2248	1794	2234	3101	4523	3588
10:00–12:00	3289	2717	2641	2509	3129	2601	2728
12:00–14:00	1311	1173	2167	2824	1517	3070	1305
14:00–16:00	1682	835	3386	1122	4274	2922	2287
16:00–18:00	2933	2403	2408	3103	3341	1228	1418
18:00–20:00	4105	4256	3652	4351	5038	4150	4561
20:00–22:00	3948	3528	4704	4200	5787	5241	4453
22:00–24:00	2807	2704	3025	1544	2150	3608	2329

Have a look at the source of this page to learn and see exactly how it all works.