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:004271232123181675625182881
02:00–04:006621231496861522710588
04:00–06:00102619411071709593382853
06:00–08:0093845612051488676352198
08:00–10:002774233020883413271530033052
10:00–12:002851316829302805367435342674
12:00–14:001058238213812480266216893628
14:00–16:003491166614282167259637882122
16:00–18:0027753392931203428212084860
18:00–20:004190364942574640533640503683
20:00–22:003529423939984872458653513697
22:00–24:002126240130453932416930371379

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:00131017061355255112826852355
02:00–04:00206134827389612921328127
04:00–06:00293234411391207557367412
06:00–08:006042783387088901223878
08:00–10:004339231031992275261225384861
10:00–12:002366211628332501324134712385
12:00–14:002918282818072889181616341580
14:00–16:00115011998072361167511121049
16:00–18:002900217324131134135113432405
18:00–20:004179336433823496474241504272
20:00–22:003888386435294788502450234872
22:00–24:004036413611993383218025052783

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