HN Explorer

Ask HN: What charts javascript library to use?

84 points by mxmpawn ↗ HN
I'm building a Django app and I'd like to use a javascript library for the charts, is it the best way to put graphics in django aplications?. I need simple types of charts: pie and bar(with negatives).

I began to use jqplot but I'm having some problems with some options.

I'd like to find a library with pretty nice and colorful charts and compatible with the majority of the principal browsers(ie,firefox,chrome).

66 comments

[ 3.4 ms ] story [ 81.7 ms ] thread
briandoll
At New Relic, we use HighCharts (http://highcharts.com/). We constantly get questions from our customers about which library we use, because they like the way they look and function. Highly recommended.
mxmpawn
That's a great library but I'll have to pay u$s360 if I want to use it. In my country it'll be ~u$s1300.
neodude
If you're only developing one application, I believe you can just buy the $80 license. That's amazingly inexpensive for such a stellar piece of software.
koenb
The $80 license says: "For use on a website that does not have customer specific data or charges for its use."

Showing a username is customer specific data I suppose, so I think most applications show customer specific data. Am I misunderstanding this limitation?

TamDenholm
I second highcharts, i find it an absolutely excellent chart library. I even created a PHP wrapper for it so i could control it from the backend.

Oh and I did this because i was bored: http://zestmonkey.com/charts.php

mitchellhislop
Is that lib. available? I was nearly going to write one, but I would rather not start from scratch.
wpeterson
+1 for High Charts. We're using these for some of our newer, light-weight charting options at PatientsLikeMe.

Great bang for the buck as your go-to first charting solution until you need something custom.

trefn
also in use at Mixpanel.
mgrouchy
We use it as well. No problems to date. Its pretty great.
Cyranix
+1 for Highcharts. We use it at MyEdu, switched away from Fusioncharts. I've had to write some workarounds for the occasional bug, but the maintainer is incredibly responsive to feedback, so drop a comment on GitHub or the Highslide forum if you run into an issue.
joe8756438
I chose to use Highcharts at Perpetually about nine months ago, I must say I am very pleased with how they have developed the library in that time. It has proven flexible enough to handle extremely varied data visualizations. Highly recommended.
qbproger
Flot is worth a shot. There may be a python library to generate is server side. When I looked into it, I kept going back and forth between javascript charts vs images. I ended up going with images because I didn't really need dynamic charts. There were also features missing from many. IIRC, Flot couldn't add a title to the x/y axis at the time I was looking at it.
mxmpawn
Thanks for your suggestion, I had previously checked Flot but didn't use it because I didn't see a pie chart in the examples. Now I looked again and the pie chart is in the trunk version.
bluedevil2k
Use Flot on several of my sites. They have some nice plugins that I like too, and it integrates very nicely with jQuery.
jmervin
I've also found flot to be fairly powerful and have used it in a couple of projects.
whouweling
I especially like the time series mode where flot assigns very meaningful time labels on the x axis when you zoom in and out. (based on unix timestamps * 1000, so easy to retrieve from a database)

You can load data from python quite easily using an jquery ajax call and json.dumps() in the view on the server side.

In general it surprises me how well the client side graph libraries scale if you load a lot of data into them.

ryanc
I was working on a Django app a few months ago that required a lot of chart features. I was impressed with how easy sparklines is to use but for some larger charts I used flot.
dochtman
We use Flot successfully, but have also looked at jqplot.
rexreed
We use the Google Charts API - it's free and very good. But I haven't seen many others comment about it. Is there a problem with using that?
martingordon
The only problem I've run into is an issue with URLs being too long when trying to chart large amounts of data.
rexreed
Google Visualizations API is also very good and (I think) avoids the problem of sending data to Google, and if locally cached, shouldn't require access to Google servers. That said, if you're running an online app, you should have access to the Google Servers, especially if you're already using their copy of jQuery for performance reasons.
patangay
I think the main problem with the google charts API is just that, it's not a library that is self contained. You need access to google's servers. Second, if you have sensitive data, you rather not send it to google.
cnlwsu
Google's visualization apis are amazing, cant recommend it enough. The chart ones are nice but you then also have to wrap it yourself to generate the GET request appropriately to the data.
drivebyacct2
The fact that it uses GET is a huge limitation IMO. Especially considering that the workaround is to use POST and iframes.

Especially when there are more functional, prettier alternatives

ClifReeder
Agreed, I've been using it for a project and have been very happy so far. Lots of options, and looks great. I've been using the GoogleVisualr library for Rails, so writing them in Ruby is nice too.
vbabiy
I have used a few like jqplot, flot, highchart.

I stuck with flot but if I was to do it again I would give high charts another look.

mimori
I like JIT which is a beautiful data visualization library. http://thejit.org/
notyourwork
We were able to use the spacetree to create an organizational chart for our employees which makes it easy for employees to find other employees. This is a great library.
bradleyland
We use Flot currently, but we're looking at purchasing a license for Emprise. Specifically, they offer candlestick charts, which are difficult to find elsewhere, yet absolutely critical in expressing the volatility of series data.

http://www.ejschart.com/

IMO, candlestick charts are way underutilized. Take application response time graphs for example. Most reporting suites rely on moving averages. If your application can have an acceptable average response time, but still have a high level of deviation. Let's say you have an app where, on average, one out of six requests is an entire order of magnitude slower than other requests:

  # Ruby code where r is response in ms
  r = [
    100,
    100,
    100,
    100,
    100,
    1000
  ]

  r.inject{ |sum, ms| sum + ms }.to_f / r.size # => 250
So my average response time is 250ms, which I may consider acceptable, yet some responses are taking 1000ms, which I wouldn't consider acceptable. With a simple line chart, I wouldn't see the significant deviation. With a chandlestick chart, the upper boundary would be blindinly obvious.
sparky
Can you just have multiple lines for Nth percentile and/or min and max, rather than candlesticks? You'd want to bold or otherwise emphasize the mean or median line, I think, but it shouldn't be too hard to read, since the lines shouldn't cross.
bradleyland
Sure. Ultimately, it all comes down to preference. So yes, you could represent your min/max as separate lines, but candlestick charts are the most widely accepted means for representing volatility. That's why they're so widely used in finance.

Candlesticks are also useful for giving a good visual indicator of your interval, which is another area where line charts fall down. There is no visual clue given with a line chart that shows you whether you're looking at a 5 minute interval, 1 hour interval, or 1 year interval. The thickness of a candlestick relative to the x-axis (usually time) gives a strong visual clue about the interval.

vanstee
Since you're already using jquery, try flot, http://code.google.com/p/flot/. It has a simple api, good documentation, pretty extensible and works in all browsers (with google's excanvas script for ie).
[deleted]
(comment deleted)
dirtyaura
I recently used Django to implemented sales reporting and analysis service for sales organization of a few hundred people.

For charts, I've used flot and it's been so far adequate for my needs (timeseries and some bar charts). I personally prefer more Tufte-like charts than the default flot style, but the customer has been delighted of flot's style.

By the way, forget pie charts, they are a bad idea. Use e.g. a simple bar chart instead.

To quote Tufte: “The only worse design than a pie chart is several of them, for then the viewer is asked to compare quantities in spatial disarray both within and between pieces.”

agbegin
Have you checked out ZingChart? Transparency: I'm on the team.

Zing renders both Flash and HTML5 Canvas charts. Compatible and customizable + interactive API.

For your consideration: http://www.zingchart.com http://www.zingchart.com/flash-and-html5-canvas/

Shoot me questions at abegin@zingchart.com or http://www.twitter.com/zingchart (Andrew)

Jlambert
The pricing model leaves a little to be desired. If I build an app that others use, i have to contact you? Really?
agbegin
Yes, at this point we've been working with software developers to make sure we provide the support and licensing model they need.

Thanks for the feedback.

ulf
As an encore, does anybody know about a library that lets you modify charts in realtime? I would like to have basic pie charts, where I could resize partitions, add and remove.
bhiggins
I've only surveyed what's out there a little, but I am impressed with Protovis's demos and apparent flexibility: http://vis.stanford.edu/protovis/
piranha
I've done quite a lot of Protovis charts and should say that they are really great, but have quite steep learning curve. But after making few first steps it starts to make sense and are quite convenient in terms of maintainability and extensibility.
kilian
I'm the author of Grafico, A Raphaël (js based SVG/VML) charting library with a focus on proper charts (per Stephen Few/Tufte) Check it out here: http://grafico.kilianvalkhof.com/ and this page has a lot of examples: http://grafico.kilianvalkhof.com/documentation/index.html

It doesn't have pie charts, because pie charts are a tremendously bad way to visualise data. I have barcharts with negatives though :)

mfalcon
Thanks for sharing your library, I'll try it for a little project of mine.
kilian
Cool, let me know how it works out! Feel free to e-mail me if you have any questions. (see my profile)