JavaScript visualization application - code organization, backbone mvc, desktop version etc

I'm setting out to develop a JavaScript web application for visualization, featuring bookmarking of various graphs wi开发者_运维技巧th annotations etc.

A typical example would be: Given a url state, show two SVG graphs and a time slider for manipulation together with some informative annotations placed out here and there.

Traditionally (and not having written JS for some time), I'd try some sort of modular JS approach:

src   
   data
   chart
       chartType1
       chartType2
       chartType3
   layoutManager
   stateManager
   utils
lib
   d3?
   backbone?
   jquery?

... breaking out the data handling, some utility functions, state & layout manager etc.

But with a plethora of libraries out there, perhaps I should hold my horses and try a new approach?

Code organization?

- Like above or more MVC like?

- Any specific patterns that would be helpful?

(pseudocode is much appreciated)

State handling/Models?

- Backbone.js

- JavaScriptMVC

Views?

- Are there any good examples of JS vis applications using SVG libraries (D3, Raphaël etc.) together with an mvc framework?

Compiler/minifier?

- Google Closure Compiler

- Jammit

IDE?

- Aptana Studio 3

- Netbeans

- Other?

Desktop version? (criteria: data storage, updatable etc.)

- AIR

- Chromium Embedded

- XULrunner

- Titanium appcelerator

- other options?

I'm sorry that the scope of this question is rather wide, but I shall consider it answered if insight into any of these domains is gained. So please help me choose ...

If you already know MVC really well, you could do great with Backbone. There were just so many unknowns with how to organize frontend javascript, we went with JavascriptMVC, which makes a lot of the decisions for you.

Not sure why I would use an IDE.. TextMate & console work great for me. NetBeans looked good when I was playing with it. JetBrains RubyMine is the highest quality and by far the best IDE, but it is commercial.

EDIT Yes, JMVC is not worth the trouble for what it provides. Backbone is elegant and simple. The only issue is if you are fairly new to code structuring, since you must define the structure of your code. If you are using rails, just copy the organization of your rails app: routers/ views/ templates/ models/

And a separate file for each class, of course. Then use something to require everything, Sprockets if you're on Rails 3.1 or really like it, or Jammit if you're on 3.0.x.

If you use coffeescript, just realize that your code is probably wrapped in a top-level closure, so if you'll either have to add your classes into a top-level hash, or declare them as window.Classname.

(Actually, "this" is "window" at the top level, so you can declare it as: class @Classname )

Good luck!

Code organization? - I do MVC like in rails (app/views, helpers, controllers, model) - framework should be grouped together IMO

State handling/Models? - Backbone.js definitely.

Views? - I don't know about vis library. For general backbone views and templating I built this https://github.com/juggy/backrub which takes care of updating the views based on events from your model/views. It saves a lot of glue code.

Compiler/minifier? - Google Closure Compiler - Jammit

I use Jammit with closure compiler as the backend. Jammit lets you group/break files efficiently.

IDE? Up to you, the lighter the better.

Desktop version? (criteria: data storage, updatable etc.) With some config you can now run web apps locally. I think you can have a look at that instead.