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:00637112135617513681513140
02:00–04:001078989681293762333739
04:00–06:00935174913281251491901215
06:00–08:00946368831589602909551
08:00–10:002415403529523079211838372312
10:00–12:004932412536944288265734543532
12:00–14:00614288015332495304914411448
14:00–16:003308244520021262216630921712
16:00–18:001711271523773443126815682825
18:00–20:003802404542574144563157314485
20:00–22:004200486041174788622457874116
22:00–24:003084187724392723210932342795

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:0099629215621405122623342317
02:00–04:009443681058501698422169
04:00–06:001176571901792182515628
06:00–08:002111503672859414669714
08:00–10:003036210025592963452326682592
10:00–12:002439268027453130270532612531
12:00–14:002493313311881886321716791391
14:00–16:002579257215791873368212484277
16:00–18:001017300116763218201423562062
18:00–20:004485440845363836523757303942
20:00–22:004956369347893864491562244704
22:00–24:001634203139152997300436761659

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