Permalink
Browse files

Renaming and initial README.

  • Loading branch information...
1 parent 20085c5 commit 0c60dff9968dab8a74e32f369f8efbc6a102df04 @topfunky committed Sep 9, 2009
View
@@ -0,0 +1,26 @@
+Description
+===========
+
+A Javascript library for creating small but informative graphs with Javascript.
+
+Packages the [Raphael](http://raphaeljs.com/) and [Cufon](http://cufon.shoqolate.com/generate/) libraries for SVG and font drawing, respectively.
+
+Author
+------
+[Geoffrey Grosenbach](http://nubyonrails.com)
+[PeepCode Screencasts](http://peepcode.com)
+
+Example
+-------
+
+See the [example page](http://topfunky.github.com/topfunky-sparkline-js)
+
+Usage
+-----
+
+ TopfunkySparkline("my_canvas_element",
+ [1,2,3,4,5],
+ {width:400, height:30, title:"A Chart"});
+
+
+
View
@@ -2,15 +2,15 @@
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
- <title>JS Sparklines</title>
+ <title>Topfunky Sparkline Javascript Library</title>
<meta http-equiv="content-language" content="en">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style>
body { font-family: sans-serif;}
</style>
</head>
<body>
- <h1>JS Sparklines</h1>
+ <h1>Topfunky Sparkline Javascript Library</h1>
<div id="chart"></div>
@@ -19,10 +19,10 @@
<script src="lib/raphael-min.js" type="text/javascript" charset="utf-8"></script>
<script src="lib/cufon-yui.js" type="text/javascript" charset="utf-8"></script>
<script src="lib/04b21_400.font.js" type="text/javascript" charset="utf-8"></script>
- <script src="lib/js-sparklines.js" type="text/javascript" charset="utf-8"></script>
+ <script src="lib/topfunky-sparkline.js" type="text/javascript" charset="utf-8"></script>
<script>
- JSSparklines('chart',
+ TopfunkySparkline('chart',
[5, 5, 5, 5, 21, 10, 3, 24, 18, 50, 0, 1, 45, 29, 5, 21, 10, 3, 24, 18, 50, 0, 1, 45, 29, 5, 21, 10, 3, 24, 18, 50, 0, 1, 45, 29, 5, 21, 10, 3, 24, 18, 50, 0, 1, 45, 29, 5, 21, 10, 3, 24, 18, 50, 0, 1, 45, 29, 5, 21, 10, 3, 24, 18, 50, 0, 1, 45, 29, 5, 21, 10, 3, 24, 18, 50, 0, 1, 45, 29, 5, 21, 10, 3, 24, 18, 50, 0, 1, 45, 29, 5, 21, 10, 3, 24, 18, 50, 0, 1, 45, 29, 5, 21, 10, 3, 24, 18, 50, 0, 1, 45, 29, 5],
{
width:400,
@@ -32,4 +32,4 @@
good_threshold:20});
</script>
</body>
-</html>
+</html>
@@ -3,16 +3,16 @@
//= require "04b21_400.font"
/*
- Usage:
- JSSparklines('chart',
- [42, 15, 21, 7],
+ Usage:
+ TopfunkySparkline('chart',
+ [42, 15, 21, 7],
{ width:400,
height:30,
title:"Monthly Revenue",
target:25,
good_threshold:20});
*/
-var JSSparklines = function(elementName, datapoints, opts) {
+var TopfunkySparkline = function(elementName, datapoints, opts) {
this.width = opts.width;
this.height = opts.height;
@@ -30,7 +30,7 @@ var JSSparklines = function(elementName, datapoints, opts) {
// Normalize
var normalizedDatapoints = [];
var maximumDatavalue = Math.max.apply( Math, datapoints );
-
+
for (var i = 0; i < datapoints.length; i++) {
normalizedDatapoints[i] = datapoints[i] / maximumDatavalue;
}
@@ -45,28 +45,28 @@ var JSSparklines = function(elementName, datapoints, opts) {
var x_offset = i*(bar_width+spacing) + this.width - datapoints.length*(bar_width+spacing);
var y_offset = parseInt(height - normalizedDatapoints[i]*height);
- var bar = paper.rect(x_offset,
- y_offset,
- bar_width,
+ var bar = paper.rect(x_offset,
+ y_offset,
+ bar_width,
Math.ceil(normalizedDatapoints[i]*height))
bar.attr({stroke:'transparent', fill:bar_color});
}
// Target line
var targetLine = paper.rect(0, parseInt(height - (target/maximumDatavalue)*height), width, 1)
targetLine.attr({stroke:"transparent", fill:color_target});
-
- // Text title
- var titleObject = paper.print(2,
- (this.height - 6),
+
+ // Text title
+ var titleObject = paper.print(2,
+ (this.height - 6),
opts.title.toUpperCase(),
paper.getFont("04b21", 400), 8);
var titleWidth = titleObject.getBBox().width;
- paper.rect(0, (this.height - 12),
+ paper.rect(0, (this.height - 12),
titleWidth + 6, 12).attr({stroke:'transparent', fill:'white'});
// HACK: Redraw title over background after font calculations
- paper.print(2, (this.height - 6),
+ paper.print(2, (this.height - 6),
opts.title.toUpperCase(), paper.getFont("04b21", 400), 8).attr({fill:"#555555"});
}

Some generated files are not rendered by default. Learn more.

Oops, something went wrong.

0 comments on commit 0c60dff

Please sign in to comment.