We Keep Coding

chart libraries that work on IE? [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 9 years ago.
I'm looking for (javascript or HTML-based) chart libraries that work on Internet Explorer. Any suggestions? Interactivity is a plus, but not necessary.
I've tried using Flot, but I'm having trouble getting it to work in IE8 (though a recent patch fixed it for IE9). I've also used the Google Chart API, but something a little more easily customizable would be preferred.

It depends a bit on what all you need to accomplish with your library,
but maybe you'll find these musings useful...
You can do quite a bit with just CSS
and make your own "library", albeit a limited one,
for graphs such as horizontal bar charts.
For instance:
http://meyerweb.com/eric/css/edge/bargraph/demo.html
http://applestooranges.com/blog/post/css-for-bar-graphs/
jQuery Sparklines is not a true "library", either,
but it has some great options, and it works all the way
back to IE 6. Definitely underrated.
http://omnipotent.net/jquery.sparkline/
Highcharts could be a good bet.
http://www.highcharts.com/
If Protovis had full support for IE, it might have to be
considered the best, because it adheres to best practices for data visualization.
However, it doesn't have the world's most accessible api, and it doesn't support IE, at least not entirely - read issue 15:
http://vis.stanford.edu/protovis/
http://code.google.com/p/protovis-js/issues/detail?id=15
Amcharts has flash-based charts at the moment, but take note:
I believe they are working on javascript library for their charts.
If and when they do come out with their library, I have a feeling
it will be pretty good.
http://www.amcharts.com/
Please also consider this when choosing a library:
if you see a plethora of 3-d stacked pie charts, or glossy bars, or drop-shadows,
then be careful: it's a good bet the makers of those charts didn't create them with
data visualization best practices in mind.

For any JavaScript chart library to work on IE 6,7,8, they need to render the chart in VML. Hence, libraries rendering using SVG or Canvas only wouldn't work (hence d3.js based solutions wouldn't work). The following libraries currently have support on IE 6,7,8 as they use a hybrid of SVG and VML:
FusionCharts JavaScript Charting # http://www.fusioncharts.com
HighCharts # http://www.highcharts.com
Any JavaScript charting library built on top of Raphael JS e.g., amcharts, gRaphael would also work on IE6,7,8.

have you tried telerik
http://www.telerik.com/
i did not use it myself, but a friend of mine thinks it is doing the job.

Check out the recently released amCharts JavaScript bundle. It brings all the interactivity of the Flash charts but in JS/HTML5.

I've used jqPlot in the past and it worked well for me. It's a jQuery plugin though; not sure if that matters to you or not.

Web charting libraries for mobile, our own research [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 7 years ago.
Improve this question
We are looking for a nice javascript-based library for a web charting application we have been asked to do. The charts will be accessible and should actually be nice to interact with via mobile devices (iOS, Android, and the like). The user will be able to drill-down into some datasets, so the snappier (both processing graphics and loading data) and the more interactive, the better.
Nowadays, there are countless options out there, and many aspects to look at. Based on my research, I have put together the following list. Apologies beforehand for any mistake, it is not intended to be 100% complete or accurate.. but I think that still useful:
https://spreadsheets.google.com/pub?key=0As7T_22rXSbtdF9YeklwcUVXSEdwQnN0a0FvcWpoU2c&output=html
What is your opinion? Do you have any experiences in such kind of application? Maybe some candidate I am missing?
We are narrowing down the choice, but I am still not sure as for what choice is the best bet. Some questions that pop-up in my mind:
Different ways of rendering the chart (SVG/VML versus HTML 5 canvas). Which one is more suited to browsers in mobile devices? Which one is more suited to user interaction?
Making it look good. Which libraries allow to easily tweak appearance? Is CSS really powerful for this?

You missed out Sencha Touch

first of all, if mobile support is a must-have for you, discard SVG as a solution. It's not widespread supported. Canvas in the other hand, is not supported by old versions of IE, but can be simulated via VML with the exCanvas.js library.
About making it looking good, CSS has nothing to do with these libraries. CSS affects DOM elements, and canvas content is binary data. Canvas is, as the word says, a blank canvas for you to draw in via a Javascript API. Once you draw a line in a canvas element, that information is just pixels in the canvas.
BTW, is a good list the one you collected, and I'm pretty sure it's quite complete. The only intruder in it is Dundas. First of all, is a .Net library, and generates the charts in the server. Second, is deprecated. Dundas is no longer selling components, they're totally engaged with their dashboards solution.
Hope I'd help.

I've chosen Flot for several projects now and it has worked well. It's well documented with lots of examples, configurable, looks great, and is extensible. It is dependent on jQuery.

You might also want to add dhtmlxChart to your list.
It's a Canvas based JavaScript charting library that supports different chart types: line, pie, area, bar, radar, etc. dhtmlxChart is distributed under GPL v2 (commercial license is needed to use it in a proprietary project).
(Disclaimer: I work for DHTMLX)

I know this is an old question, but we had to do a similar research recently.
We focused our study on mobile charting libraries (Android and iOS, native or hybrid -with Cordova-) supporting line / area charts. All the information has been gathered from the websites of the respective chart libraries and no personal test has been made (yet).
Here's the result:
https://goo.gl/0tVC6a
I hope it helps.

which is the best among jquery,moo tool and yui? [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 12 years ago.
Hi among the jquery ,mootool ,yui and glow have crossbrowser compatiblity

jquery - all the way! I avoid the rest of the tools!

By best you have to define what you mean. It depends on many factors.
I prefer jquery since its user base is too large and the availability of plugins.

JQuery has been gaining good popularity. The compatibilty of JQuery with most of the browsers is higher. Jquery has picked up very well and so, Its better to try out JQuery only.

I'd recommend jQuery above anything. Microsoft visual studio 2010 ships with jQuery support which is a good benchmark for this test. Also jQuery has vast audience that develop plugins for jQuery.

I use jQuery, becouse it's intuitive and there is a lot of feedback and plugins.
compatibility
Jquery: Firefox 2.0+
Internet Explorer 6+
Safari 3+
Opera 9+
Chrome 1+, There are known problems with: Firefox 1.0.x
Internet Explorer 1.0-5.x
Safari 1.0-2.0.1
Opera 1.0-8.x
Konqueror
Mootool: MooTools is compatible and fully tested with Safari 2+, Internet Explorer 6+, Firefox 2+ (and browsers based on gecko), Opera 9+, and Chrome 4+.
Yui: http://developer.yahoo.com/yui/articles/gbs/

Here you can see comparison of javascript frameworks. Personally I vote for jQuery, because at its slogan says Write less, do more.
Update
Right here, in stackoverflow you can see the hot discussion about this subject in this question.

At the end of the day, it depends what you want to use the framework for.
I would recommend that you start by learning to write pure javascript, only then will you find out where the relative utility of a framework comes in.
If you want a framework that has the widest browser compatibility, along with best performance on older computers/browsers then the rather annoyingly named 'my library' probably wins out.
Simply because it does feature detection rather than try to infer the browser name / version, which is a rather craptastic cop-out that most of the established libraries are guilty of.
I would recommend you give each of them a go and see what suits your need, locking yourself in to one particular framework too early will only hurt you long term; When holding a hammer, every screw looks like a nail etc.
Personally I favor YUI3 - it has strong OOP support as well as flexible CSS3 style DOM querying and a great selection of quality RIA widgets.
I wouldn't let myself be too swayed by arguments ad populem, plenty of people do silly things, find out what is right for you and your problem domain.

Getting started with game development using js/html5 [closed]

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.
Closed 10 years ago.
Anyone have experience with game development using javascript and the html5 canvas element?
So far I have found two libraries, are either of these worth using?
http://tommysmind.com/ (XNA Port)
http://gamequery.onaluf.org/ (jquery plugin)
Does anyone have any other resources?

You can also use Lime JS - very promising HTML5 game developement framework.
http://www.limejs.com

A bit late to this ;-) but here are some current or emerging frameworks
Aves http://www.dextrose.com/en/projects/aves-engine
Akihabara http://www.kesiev.com/akihabara/
Rokcet Pack http://rocketpack.fi/
Effect Games http://www.effectgames.com/effect/
these are probably overkill for the kind of games you're mostly referring to.
Also, take a look at Sencha Touch
http://www.sencha.com/
There's a very slick solataire example here
http://touchsolitaire.mobi/app/
HTH

impact js looks really cool, http://impactjs.com/ but it has $99 price tag :( But it comes with an awesome level editor so it might be worth the price.

For basic 2d games i would use either impact or Crafty
Crafty is open source, but impact has a cool level editor.
All the others that i have tested are either lacking in some areas or too expensive. Aves and Rocket has been bought by Zynga and Disney.

Have a look at Processing.js. Maybe you can use it for 2D drawing and user interaction.

You can use for example this one port http://cocos2d-javascript.org/ for game dev.

Another library you could look at is google forplay. While not a true javascript/html5 library it compiles to javascript from java much in a way like GWT.

I have not built a game engine but rather a classic game in its near-entirety, plus a few simple animations, into my Tetris clone.
Its most important feature in my opinion is the effectiveness of the multitouch control scheme when you load up the page in iOS or Android. The idea is for it to be intuitive enough that I shouldn't have to show instructions for the user to figure out how to play it.

Try our HTML5 game engine, Construct 2 (http://www.scirra.com). We have an extensive free edition available so you can play around with it!
It's an event based system which means you don't need to know programming to get going in it. However it is extendable with our Javascript SDK so anyone can write their own plugins to extend it's functionality.
A few great games have started to pop up on our arcade now as proof that it works well!
http://www.scirra.com/arcade

I have personal experience of developing a HTML 5 browser game with Dead Earth! I found that I did not need to use any specific libaries other than JQuery along with a few Jquery plugins.
I used the Canvas and the Audio elements in Dead Earth. But I did not create any fancy 3D graphics I only drew shapes and images, colouring said shapes, drew lines etc.
I imagine if you are doing something more complicated than this you may need a library otherwise why make your app more bloated than it needs to be?

jQuery SVG vs. Raphael [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 9 years ago.
Improve this question
I'm working on an interactive interface using SVG and JavaScript/jQuery, and I'm trying to decide between Raphael and jQuery SVG. I'd like to know
What the trade-offs are between the two
Where the development momentum seems to be.
I don't need the VML/IE support in Raphael, or the plotting abilities of jQuery SVG. I'm primarily interested in the most elegant way to create, animate, and manipulate individual items on an SVG canvas.

I've recently used both Raphael and jQuery SVG - and here are my thoughts:
Raphael
Pros: a good starter library, easy to do a LOT of things with SVG quickly. Well written and documented. Lots of examples and Demos. Very extensible architecture. Great with animation.
Cons: is a layer over the actual SVG markup, makes it difficult to do more complex things with SVG - such as grouping (it supports Sets, but not groups). Doesn't do great w/ editing of already existing elements.
jQuery SVG
Pros: a jquery plugin, if you're already using jQuery. Well written and documented. Lots of examples and demos. Supports most SVG elements, allows native access to elements easily
Cons: architecture not as extensible as Raphael. Some things could be better documented (like configure of SVG element). Doesn't do great w/ editing of already existing elements. Relies on SVG semantics for animation - which is not that great.
SnapSVG as a pure SVG version of Raphael
SnapSVG is the successor of Raphael. It is supported only in the SVG enabled browsers and supports almost all the features of SVG.
Conclusion
If you're doing something quick and easy, Raphael is an easy choice. If you're going to do something more complex, I chose to use jQuery SVG because I can manipulate the actual markup significantly easier than with Raphael. And if you want a non-jQuery solution then SnapSVG is a good option.

For posterity, I'd like to note that I ended up choosing Raphael, because of the clean API and "free" IE support, and also because the active development looks promising (event support was just added in 0.7, for instance). However, I'll leave the question unanswered, and I'd still be interested to hear about others' experiences using Javascript + SVG libraries.

I'm a huge fan of Raphael and the development momentum seems to be going strong (version 0.85 was released late last week). Another big plus is that its developer, Dmitry Baranovskiy, is currently working on a Raphael charting plugin, g.raphael, which looks like its shaping up to be pretty slick (there are a few samples of the output from the early versions on Flickr).
However, just to throw another possible contender into the SVG library mix, Google's SVG Web looks very promising indeed (even though I'm not a big fan of Flash, which it uses to render in non-SVG compliant browsers). Probably one to watch, especially with the upcoming SVG Open conference.

Raphael is definitely easier to set up and get going, but note that there are ways of expressing things in SVG that are not possible in Raphael. As noted above there are no "groups". This implies that you can't implement layers of Coordinate Transfomations. Instead there is only one coordinate transform available.
If your design depends on nested coordinate transforms, Raphael is not for you.

Oh Raphael has moved on significantly since June.
There is a new charting library that can work with it and these are very eye catching.
Raphael also supports full SVG path syntax and is incorporating really advanced path methods. Come see 1.2.8+ at my site (Shameless plug) and then bounce over to the Dmitry's site from there.
http://www.irunmywebsite.com/raphael/raphaelsource.html

I think it is not totally unrelated but did you consider canvas? something like Process JS can make it simpler.

You should also take a look at svgweb. It uses flash to render svg in IE, and optionally on other browsers (in the cases where it supports more than the browser itself does).
http://code.google.com/p/svgweb/

I will throw my vote behind Raphael - the cross-browser support, clean API and consistent updates (so far) make it a joy to use. It plays very nicely with jQuery too. Processing is cool, but more useful as a demo for bleeding-edge stuff at the moment.

As a Javascript beginner, I found Rapahel samples not so easy, I recommend http://cancerbero.mbarreneche.com/raphaeltut, which is a real Step by step tutorial.

For those who don't care about IE6/IE7, the same guy who wrote Raphael built an svg engine specifically for modern browsers: Snap.svg .. they have a really nice site with good docs: http://snapsvg.io
snap.svg couldn't be easier to use right out of the box and can manipulate/update existing SVGs or generate new ones. You can read this stuff on the snap.io about page but here's a quick run down:
Cons
To make use of snap's features you must forgo on support for older browsers. Raphael supports browsers like IE6/IE7, snap features are only supported by IE9 and up, Safari, Chrome, Firefox, and Opera.
Pros
Implements the full features of SVG like masking, clipping, patterns, full gradients, groups, and more.
Ability to work with existing SVGs: content does not have to be generated with Snap for it to work with Snap, allowing you to create the content with any common design tools.
Full animation support using a straightforward, easy-to-implement JavaScript API
Works with strings of SVGs (for example, SVG files loaded via Ajax) without having to actually render them first, similar to a resource container or sprite sheet.
check it out if you're interested: http://snapsvg.io

Since it's not mentioned here yet:
You should also take a look at Dojox.drawing, which also provides good SVG drawing capabilities. It has a pretty impressive set of features. I'm just starting a project with it, but it seems to me that it's far superior (at least in terms of features) to Raphael and JQuerySVG.
This presentation convinced me to use it instead of Raphael/JQuerySVG:
http://www.slideshare.net/elazutkin/dojo-gfx-svg-in-the-real-world-2114082
Reference:
http://dojotoolkit.org/reference-guide/dojox/index.html
Reference on Dojocampus:
http://docs.dojocampus.org/dojox/drawing
Download Dojo (including Dojox):
http://dojotoolkit.org/download/

Another svg javascript library you might want to look at is d3.js. http://d3js.org/

I prefer using RaphaelJS because it has great cross-browser abilities. However, some SVG & VML effects can't be achieved with RaphaelJS (complex gradients...).
Google has also developped a library of its own to enable SVG support in IE:
http://svgweb.googlecode.com/files/svgweb-2009-08-20-B.zip

If you don't need VML and IE8 support then use Canvas (PaperJS for example). Look at latest IE10 demos for Windows 7. They have amazing animations in Canvas. SVG is not capable to do anything close to them.
Overall Canvas is available at all mobile browsers. SVG is not working at early versions of Android 2.0- 2.3 (as I know)
Yes, Canvas is not scalable, but it so fast that you can redraw the whole canvas faster then browser capable to scroll view port.
From my perspective Microsoft's optimizations provides means to use Canvas as regular GDI engine and implement graphics applications like we do them for Windows now.