In NetCharts Server 4.0, images can be inserted into dynamically-generated tables to assist in creating more intuitive data assessments. With a bit of JavaScript, and using the CUSTOMDECIMAL column definition, you can put something interesting into cells holding dynamic data. See this in a sample report below:
GameCzars New Product Gross Revenue Overview
GameCzars put out four new products in December of 2000, in time for Christmas sales. This report charts their progress in the eight quarters following.
War Hamster - humorous board strategy game intended to cash in on the returning popularity of board games - big seller, but suffers from the national economic trends:
Dork Shadows - crossover Goth/Computer-related role playing game - the worst performer
Mazewars - hybrid board/card battle game - periodic performer
Wizard Strike - fantasy card game - low revenue, but steady performance
The chart below shows the trends fairly well, but the War Hamster sales so overshadowed the rest of these products that we also show details in the table. Progress against expected goals is shown, as well, without confusing the graph, through the red and green indicators.
Sales Goals:
- War Hamster - $105,000 per quarter
- Dork Shadows - $12,500 per quarter
- Mazewars - $30,000 per quarter
- Wizard Strike - $8000 per quarter
(By the way, this report is entirely fictional and based on no real data whatsoever. It is intended solely as a demonstration of NetCharts Server.)
This is all it takes to achieve this effect, that allows table to communicate more information, in the table template file, for each column that is going to have a status image.
column2FormatType:CUSTOMDECIMAL
column2Format:'<script>var value='##.##'; if(value>=105000) imagename="greendot.gif"; else
imagename="reddot.gif"; document.writeln(value+" "+"<img src="+imagename+">"+" ");
</script>'
To make it work, you need to use the CUSTOMDECIMAL format type with value='##.##'. However, look at the simple JavaScript inserted there! The value is compared with a number, and thus an image is chosen.
Then there is a document.writeln statement that writes a tiny bit of HTML into the cell to show both the image and the value. Anything that can go into a document.writeln, within the scope of this cell, can get inserted into a NetCharts Server dynamic table.