

Peity - Little charts for little projects - reustle
http://benpickles.github.com/peity/

======
gfodor
The combination of sparklines and pie charts may just cause Tufte's head to
explode.

~~~
ema
Just because Tufte has taste doesn't mean he can't deal with ugliness.

------
SCdF
"Peity (sounds like deity)"

As someone who pronounces deity day-a-tee, I'm guessing you actually mean pee-
a-tee and not pay-a-tee.

~~~
StavrosK
Why not just call it Piety?

~~~
benpickles
Yes I wish I'd done that 2 1/2 years ago!

~~~
StavrosK
Me too :-P

------
osi
also: <http://omnipotent.net/jquery.sparkline/#s-about>

~~~
zheng
So let's say I don't care about compatibility, what is the real differences
between Peity and jQuery sparklines?

~~~
jonstjohn
Size would be one, Peity is 5k uncompressed, sparklines is 119k - big
difference there.

------
tcdent
Defining colors with the non-W3C-defined term 'colour' is cute, but annoyingly
inconsistent with browser terminology.

~~~
benpickles
Just because it's a standard doesn't mean it's spelt correctly ;) HTTP referer
[sic] comes to mind <http://en.wikipedia.org/wiki/HTTP_referer>

------
pvidler
Very interesting, but most of these examples look like they would be fairly
nonsensical to someone without JavaScript enabled (especially the line chart).
To say nothing of those who use screen readers.

Is there a handy way of providing some more meaningful 'alt' text? Perhaps
just ignore text in the element? (I didn't check -- you may already be doing
this, but I didn't see it mentioned).

~~~
1monthlater
Who isn't using javascript?

~~~
pvidler
People who keep it disabled on all but a few white-listed sites.

------
pyre
In the "Events" section, changing the value to 5/5 results in an empty pie
chart, rather than a full one. 0-4 out of 5 all work correctly.

Edit:

The violet 16px 7/7 example in the "Tips" section on the page is also missing.

Browser: Chromium 18.0.1025.151 (Developer Build 130497 Linux) Ubuntu 11.04

~~~
keithpeter
Works as expected (full pie) on Firefox 13/Ubuntu

------
kmfrk
This looks better than anything else I have seen in graph tools. Shame about
the lack of fall-back options, though.

What does it look like, if a browser doesn't support the graphs? Do they just
disappear?

~~~
BCM43
I was running without javascript, and was confused for a second when there
were no example graphs.

------
mseebach
I used these in a small mockup app a little while ago. I'm aware of their
inappropriateness for representing data, but for adding quick color, pop and
smartness to a prototype, they performed beautifully.

------
camtarn
The 'delimeter' param is misspelled... should be 'delimiter'.

~~~
reustle
Not my project, but you can open an issue or pull request :)
<https://github.com/benpickles/peity>

------
prezjordan
Wow, awesome! I was going to roll my own (pie charts) this weekend, but now I
don't have to (probably wouldn't have been able to, anyway). This looks great,
thanks!

------
CognitiveLens
This looks great, and because it's based on <canvas> rendering, everything
looks perfectly sharp on retina displays...

~~~
benpickles
Actually it took a little work to get things crisp on retina displays -
[https://github.com/benpickles/peity/blob/master/jquery.peity...](https://github.com/benpickles/peity/blob/master/jquery.peity.js#L39-50)

I think I got the technique from here - [http://joubert.posterous.com/crisp-
html-5-canvas-text-on-mob...](http://joubert.posterous.com/crisp-
html-5-canvas-text-on-mobile-phones-and)

------
hcarvalhoalves
Simple hacks are the best hacks.

------
oakwhiz
This goes great with the HTML5 <meter> tag.

------
wildmXranat
Not bad. Resembles sparkline.

------
FrancescoRizzi
Cool Sparklines and more!

------
rorrr
Since you only support IE9+, I don't see how any serious project would pick
your charts. IE8 is still #3 most common browser version in the world. IE7 is
#5.

[http://gs.statcounter.com/#browser_version-ww-
monthly-201105...](http://gs.statcounter.com/#browser_version-ww-
monthly-201105-201205)

~~~
antimora
There is a flash based implementation of the canvas that could be used in
place of missing element. It only requires a simple drop in code.

<http://flashcanvas.net/>

~~~
benpickles
Thanks, hadn't heard of that one.

------
alinajaf
Woohoo, Hi Ben!

------
sakthivelila
i need some hacking tool

