JavaScript InfoVis Toolkit published to NuGet package repository.

Recently I’ve been playing around with the JavaScript InfoVis Toolkit developed by Nicolas Garcia Belmonte. The toolkit is a comprehensive library for producing rich info-graphics including styling and animation and is fed off a JSON input. I was looking at using it to visualise an organisational chart but it can do much more than that.

After playing around with it a little bit I decided that it would be handy if the toolkit was actually contained in a NuGet Package. So I created a fork and pushed it into the temporary NuGet Package repository. The package has now been accepted and is available from the package manager console in Visual Studio 2010 (with NuGet installed, or ASP.NET MVC 3.0 or above).

Getting Started

The first thing you need to do is open up your ASP.NET application inside Visual Studio 2010. The package assumes that you are using ASP.NET MVC, but to be honest it’ll work just fine with plain-old ASP.NET as well (except that the samples will be located under /Content/JitExamples/).

JITSolutionExplorer

Once you have your project open and selected, go to the Package Manager Console and issue the command “install-package JavaScriptInfoVisToolkit”. This will install the package into the ASP.NET application.

JITPackageManager

The package contains three script files (jit.js, jit-yc.js, excancas.js) and a number of samples (under /Content/JitExamples). Once you are comfortable with how the toolkit works you can simply delete the examples.

JITSolutionExplorerInstalled

If you want to get a feel for what the package can do, set the various HTML files under JitExamples to your start page and hit F5. Enjoy!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s