10
Dec
// php the_time('Y') ?>
dygraphs is an open source JavaScript charting library for displaying data of time series.
It can show values on mouseover that makes discovering the values easier & zooms any selected area.

The data can be called from a CSV file or mentioned in the code staticly (in CSV format).
The library can handle fractions intelligently & supports error bands around data series.
It works in all major browsers (IE requires excanvas) & it is compatible with the Google Visualization API.
Requirements: No Requirements
Compatibility: All Major Browsers
3
Dec
// php the_time('Y') ?>
Highcharts is a JavaScript charting library for creating interactive charts in various types (line, spline, area, areaspline, column, bar, pie & scatter).
The library offers a high-level of usability with features like:
-
tooltip labels displaying info on hovered items
-
zooming on a specific part of the chart
-
text rotation on labels for a better readability

Highcharts has an admirable effort in browser compatibility. For standard browsers it uses the canvas element and in some cases SVG for the graphics rendering. In Internet Explorer, graphics are drawn using VML. Besides all major browsers, it works in iPhone & IE6.
The library is offered for free to be used in personal/non-commercial projects & requires a license for commercial ones.
Requirements: No Requirements
Compatibility: All Major Browsers
11
Jul
// php the_time('Y') ?>
TypeSelect is a JavaScript-based solution for using selectable custom fonts on the web.
It combines the power of typeface.js, jQuery, the canvas, toDataURL, CSS background properties & real overlayed text to accomplish this feature.

TypeSelect is very easy to understand & implement. It is totally controlled via CSS & no server-side files are required.
It has support for double/triple-click selections, UTF-8 characters & gracefully degrades in IE6.
On the other hand, currently, it has some limitations like unselectable text in IE, not being able to use :hover or line breaks & few more.
Requirements: jQuery, Typeface.js
Compatibility: All Major Browsers (with some limitations)
12
Apr
// php the_time('Y') ?>
Protovis is a JavaScript library for visualizing data using the canvas element.
Custom views of data can be composed with simple graphical primitives like bars and dots. These primitives are called marks, and each mark encodes data visually through dynamic properties such as color and position.

Although Protovis looks complicated, it is very easy to understand (specially for JavaScript users) & has a straight forward logic which offers a flexible way to create any type of visualizations.
To see more, you can check the API documentation (very well-documented) & examples built with it.
14
Dec
// php the_time('Y') ?>
Pixastic is an open source JavaScript image processing library.
It uses HTML5 Canvas element that enables accessing to raw pixel data.

Supported effects are:
- desaturation/greyscale
- invert
- flipping
- brightness/contrast adjustment
- hue/saturation
- emboss
- blur & more
There is an image editor built with it & the library is well-documented.
Requirements: No Requirements
Compatibility: All Major Browsers (IE requires ExCanvas)
3
Sep
// php the_time('Y') ?>
This is another Coverflow script which uses canvas for the effects.
The script is very easy to implement & works smoothly.

Images can be browsed via scroll wheel or left-right keys besides the mouse clicks. And, it is tested with other javascript libraries like jQuery, MooTools, Dojo and Prototype.
For the canvas support in IE, checkout ExplorerCanvas.
Requirements: No Requirements
Compatibility: All Major Browsers (Explorer Canvas can be used for IE)
8
Aug
// php the_time('Y') ?>
Raphaël is a JavaScript library that facilitates using & creating vector graphics in websites.
It uses SVG & VML for creating graphics. As every graphic generated is a DOM object, you can manipulate them via JavaScript.

This graphics JavaScript library is very ideal for creating charts, images effects like rotation or reflection.
An example:
Creating graphics is much easier with Raphaël compared to writing everything from scratch as a circle can be created with:
paper.circle(320, 240, 50).attr({fill: "#223fa3", stroke: "#223fa3", "stroke-width": 3, "fill-opacity": 0.5});
The library currently works in all major browsers except Firefox 2 & it is still under development.
Requirements: No Requirements
Compatibility: Firefox 3.0+, Safari 3.0+, Opera 9.5+ and Internet Explorer 6.0+
31
Jul
// php the_time('Y') ?>
ProtoChart is an open source canvas chart library built with Prototype.
This library is highly inspired from Flot, Flotr and PlotKit & it enables us to create different chart types on the fly.

Features of this chart library:
- Line, bar, pie, curve, mix, and area charts available
- Multiple data series on same graph
- Highly customizable legend support
- Customizable grid, grid border, background
- Customizable axis-tick values (both x and y)
- Supports: IE6/7, FF2/3 and Safari
- Even works on an iPhone!
As IE6 does not support the canvas tag, Excanvas library is used for compatibility.
Requirements: Prototype 1.6+, Excanvas for IE6 compatibility
Compatibility: All Major Browsers & iPhone
14
Jul
// php the_time('Y') ?>
JavaScript Image Effects is a library that you can instantly create effects like rotate, blur, emboss & more.

Using such a library is very functional in situations where you may need to add an effect to lots of images, need to provide an interface to the users for creating effects & so.
How to use?
After inserting the imagefx.js file into your webpage, you have 2 options:
<script type="text/javascript" >
jsImageFX.doImage(document.getElementById("myimage"), "blur");
</script>
or
<img src="image.jpg" imagefx="blur" />
where both are very easy to apply.
Every image effect is not available in every browser and a comprehensive browser compatibility chart can be found in the website
Requirements: No Requirements
Compatibility: Browser compatibility chart is provided at the website.
9
Jul
// php the_time('Y') ?>
BgPatterns is a pattern library where you can find, create & share patterns.
You can create the patterns from ready-to-use images by changing the colors & canvas and scaling or rotating them. And this process is done with a slick interface.

The pattern design interface lets you preview them easily.
And, you can also check the recently created and popular patterns.