Creating a Bar Graph with HTML and CSS using ColdFusion - Part 2 | EDESIGNERZ.NET

Creating a Bar Graph with HTML and CSS using ColdFusion - Part 2

Sunday, 07 February 2010 22:00

Graphs in web pages and reporting applications can be put together with built-in ColdFusion functionality using the tag, or with JavaScript libraries that are widely available. However, sometimes you have a need for a simple bar graph that does not depend on this more advanced technology; working with ColdFusion servers that do not have functioning on the server, or targeting browsers that are not JavaScript enabled.

Bar graphs can be created quite easily using ancient HTML technology without the aid of more advanced techniques for simple bar graphs that display quickly and across all browsers. For this tutorial, I'll assume you know basic ColdFusion and SQL -- writing queries, views, and getting the results you want.

A bar graph can be built vertically or horizontally. The first part showed the horizontal graph. This part will show the vertical graphing process. The basic process is to create the SQL query that you want to view the result as a graph, use a slim image that can be stretched as a basis of the bar graph, and set the height of the image based on the value of your data. For example, a value of $50 might translate to 50 pixels high, and $500 might translate to 500 pixels high. Using simple formulas, we'll create the graphs.

The Creating a Bar Graph with HTML and CSS Series:
Creating a Bar Graph with HTML and CSS using PHP - Part 1
Creating a Bar Graph with HTML and CSS using ColdFusion - Part 1
Creating a Bar Graph with HTML and CSS using PHP - Part 2
Creating a Bar Graph with HTML and CSS using ColdFusion - Part 2 ...

Posted: 2010-02-07 22:00:00

Read Full Article