Open Source Resources for Web Application Developers

Are you still using the traditional 2D graph for your reports and presentations? N.Design Studio taught us how to create 3D Pie Charts with Illustrator CS2 at ease. The Pie Charts looks so real and professional.

As a freelancer, we may come into the situation that you have to present some sort of statistical data to your client. Of course you may use Excel’s graph tool to easily create a bunch of charts, but more or less all of those predefined designs suck. Bartelme Design show us how to create visually appealing Pie charts using Adobe Illustrator’s graph tool.

GoSquared showed us how to create beautiful Pie Charts in Illustrator. Just follow a few simple steps, and you’ll view pie charts in a whole new light.

IMmodernLife created a comprehensive tutorial of how to make overwhelming niceness of the Pie Charts. He is using Adobe Illustrator CS2, but the tips should apply to most of the more recent versions.

Requirements: Adobe Illustrator
Demo 1: http://www.ndesign-studio.com/resources/tutorials/3d-graphs/”
Demo 2: http://bartelme.at/journal/archive/creating_graphs/journal/281/
Demo 3: http://www.gosquared.com/liquidicity/archives/103
Demo 4: http://www.modernlifeisrubbish.co.uk/article/howto…
License: License Free

• 7 Comments

FusionCharts Free is a flash charting component that can be used to render data-driven & animated charts for your web applications and presentations. It is a cross-browser and cross-platform solution that can be used with ASP.NET, ASP, PHP, JSP, ColdFusion, Ruby on Rails, simple HTML pages or even PowerPoint Presentations to deliver interactive and powerful flash charts. You do NOT need to know anything about Flash to use FusionCharts. All you need to know is the language you’re programming in.

The free version offers you most of the features that you would normally need. If the features in free version does not satiate your requirements, you might consider a paid version. In contrast, offers a lot more advanced options like gradients, 3D Lightings (shadow, blur effect, glow effect and bevel), custom animations, in-built debuggers, more chart types, enhanced AJAX support, data-driven flash maps, loading into other Flash movies, personalized implementation support etc.

If you are interested, you may want to look at FusionCharts Google Gadget as well.

Requirements: Flash Support
Demo: http://www.fusioncharts.com/Free/Gallery.asp
License: License Free

• 2 Comments

PHP/SWF Charts is a simple, yet powerful PHP tool to create attractive web charts and graphs from dynamic data. Use PHP scripts to generate or gather the data from databases, then pass it to this tool to generate Flash (swf) charts and graphs. PHP/SWF Charts makes the best of both the PHP and SWF worlds. PHP scripts provide integration, and Flash provides the best graphic quality. It supports many charts types, Line, Column, Stacked column, Floating column, 3D column, Stacked 3D column, Parallel 3D column, Pie, 3D Pie, Bar, Stacked bar, Floating bar, Area, Stacked area, Candlestick, Scatter, Polar, Mixed, Composite and Joined. Can you ask for more? They have the following main features.

• Web charts and graphs from dynamic data
• Live and interactive chart updates without reloading the web page
• Clickable charts, and drill-down
• Animated transitions
• Printable charts
• Simple and flexible chart generation

PHP/SWF Charts is free to download and use. The free, unregistered version contains all the features except for:

1. Clicking a chart takes the user to the PHP/SWF Charts web site
2. No displaying charts inside another flash file
3. No technical support, and no product updates by e-mail

Requirements: Flash Player 6+, Server with PHP Support
Demo: http://www.maani.us/charts/index.php?menu=Gallery
License: License Free

• 8 Comments

Timeplot is a DHTML-based AJAXy widget for plotting time series and overlay time-based events over them (with the same data formats that Timeline supports). Just like Timeline or Google Maps, Timeplot can be used with zero software installation, server-side or client-side. You can populate Timeplot with data by pointing it to an space or comma separated file. Timeplot also supports Timeline’s XML format, meaning that you can reuse the same data file of your Timeline and overlay them over a time series plot. It looks so specialized and works smoothly. It is a very great charts tool to represent complex data.

Requirements: Any Browsers supprts Javascript
Demo: http://simile.mit.edu/timeplot/
License: BSD License

• 2 Comments

A set of Emprise Javascript Charts ( Line, Area, Scatter, Pie, Bar and Function series ) with zooming, scaling and scrolling ablity. Built with compatibility in mind and tested on all major browsers, you can be assured your charts will function consistently for the broadest range of end users. Every aspect of the charting display can be configured and customized through well-documented properties and methods. It is free for everyone unless you want extra features.

Requirements: Safari, Camino, Firefox and Internet Explorer 6+, Opera
Demo: http://www.ejschart.com/examples/index.php
License: License Free

• 3 Comments

AmCharts provides us three type of charts, Pie Charts, Line Charts and Bar/Column Charts. They are all animated and interactive Flash Charts. Users can pull out a slice of pie chart by clicking on it. Users can zoom in/out by highlighting a specific area of the line chart. The bar/column can be 100 stacked, mouseover to view more details. All Charts are free to download, the only limitation of free version is that a small link to AmCharts will be displayed in top left corner of your charts.

Requirements: Any Modern with Flash 8.0+
Demo: http://www.amcharts.com
License: License Free

• 0 Comments

Solutoire took part of PlotKit and wrote some parts himself, then made Plotr which does not need the Mochikit library to work with. It is also a lightweight charting framework with only 12kb. There are more than 30 options for you to customize the chart. Like PlotKit, you can display Pie Charts, Line Charts and Bar/Column Charts.

Requirements: Firefox 1.5+, Safari 2.0+, Opera 9.0+, IE6+ (emulated)
Demo: http://www.solutoire.com/plotr
License: BSD License

• 0 Comments

PlotKit is a Chart and Graph Plotting Library for Javascript. It has support for HTML Canvas and also SVG via Adobe SVG Viewer and native browser support. It is fully documented and easy to use.

Requirements: HTML Canvas: Safari 2+, Opera 9+, Firefox 1.5+, IE 6
Requirements: SVG: Opera 9+, Firefox 1.5+ (see note), IE6 with Adobe SVG.
Demo: http://media.liquidx.net/js/plotkit-tests/dynamic.html
License: BSD License

• 0 Comments

Measure Map released a version of Date Slider to public. The date slider is a Flash visualization that Measure Map uses as one way to navigate the site. It is actually an interactive bar chart, users can moverover each bar to view the details. And also, they can select a date range, for example, 20-July-2007 to 31-July-2007, some variables are sent from Flash to JavaScript so that we can show the users how many things are between the date range. Users can analysis the data in an easy way. Developers can also customize the colors of the chart.

Requirements: Any Modern Broswers with Flash 6.0+
Demo: http://www.measuremap.com/developer/slider
License: Creative Commons License

• 1 Comment