RequireJS

The JavaScript InfoVis Toolkit provides tools for creating interactive data visualizations for the web. The best way to start is to take a look at the demos page. Each demo has a See the Example Code link that takes you to the code for that example. The actual library code is included in the HTML file by building the lib each time with only the needed requirements taken from the name of the visualization and the build.json file. The required library code is built by the build.py file. In order to create a new visualization you need to set up the server environment to include test JavaScript files for your new visualization and also you need to add the new visualization files into the Source folder.

Masonry is a JavaScript grid layout library. It works by placing elements in optimal position based on available vertical space, sort of like a mason fitting stones in a wall. You’ve probably seen it in use all over the Internet. All sizing and styling of items is handled by your own CSS. Item sizes can be set with percentages for responsive layouts. Unloaded images can throw off Masonry layouts and cause item elements to overlap. imagesLoaded resolves this issue. imagesLoaded is a separate script you can download. You can initialize Masonry in HTML, without writing any JavaScript. All options are optional, but column width and item selection are recommended. Align items to a horizontal grid. Use element sizing for responsive layouts with percentage widths. Element sizing options allow you to control the sizing of the Masonry layout within your CSS. This is useful for responsive layouts and media queries.