background preloader

Arbor.js

Arbor.js
about arbor Arbor is a graph visualization library built with web workers and jQuery. Rather than trying to be an all-encompassing framework, arbor provides an efficient, force-directed layout algorithm plus abstractions for graph organization and screen refresh handling. It leaves the actual screen-drawing to you. This means you can use it with canvas, SVG, or even positioned HTML elements; whatever display approach is appropriate for your project and your performance needs. As a result, the code you write with it can be focused on the things that make your project unique – the graph data and your visual style – rather than spending time on the physics math that makes the layouts possible.

http://arborjs.org/

Related:  Developpement

arbor.js » reference about arbor Arbor is a graph visualization library built with web workers and jQuery. Rather than trying to be an all-encompassing framework, arbor provides an efficient, force-directed layout algorithm plus abstractions for graph organization and screen refresh handling. AwesomeChartJS Description AwesomeChartJS is a simple Javascript library that can be used to create charts based on the HTML 5 canvas element. The main goal during development was to pick sane defaults in order to let the user create simple charts quickly with just a couple of lines of code. One can create at almost no time bar, pie, doughnut and Pareto charts. NOTE: If you are interested in a far more advanced, interactive JavaScript plotting library, take a look at Flot. Download

Tutorial: How to Build an HTML5 Video Player UPDATE: This tutorial has been rolled into an open source html5 video player. This is a tutorial on building an HTML5 video player in Javascript. It’s meant to give you a basic understanding of the different options you have with the new video tag in HTML5, and the javascript needed to create some of the typical video controls you’d find in other players. It’s library agnostic, meaning you don’t need a library like jQuery to create it, however once you understand how everything works it can definitely be simplified/improved on. I’m always open for feedback if you have suggestions. View the final result.

PhoneGap From Scratch: Introduction Want to learn how to use PhoneGap, but don't know where to get started? Join us as we put together "Sculder", not only a tribute to an excellent science fiction TV series, but a fully-fledged native mobile application for the believer in you! In this series, we will build a mobile application using some of the features in PhoneGap. progressive <canvas> pie charts Peity (sounds like deity) is a jQuery plugin that converts an element's content into a <svg> mini pie 2/5 donut 5,2,3 line 5,3,9,6,5,9,7,3,5,2 or bar chart 5,3,9,6,5,9,7,3,5,2 and is compatible with any browser that supports <svg>: Chrome, Firefox, IE9+, Opera, Safari. Download version 3.2.1 Uncompressed 8.7Kb

humble finance - html5 visualization HumbleFinance is an HTML5 data visualization tool written as a demonstration of interactive graphing in HTML5. It is similar to the Flash tool on The tool itself is written entirely in JavaScript, using the Prototype and Flotr libraries. It can be used to display any two 2-D data sets of real numerical data which share an axis. Demo: This demo displays historical stock data for Google from their IPO to March 5th, 2010.

HTML5 Video Player Development This post is also available in: Russian Year by year, we become more involved with media technology than ever before. The World Wide Web is also sensitive to this trend as shown by immense success and popularity of online video services, such as YouTube. However, you cannot run such systems without the technology for video content playback at the end user level.

envision - demos Envision.js is a library for creating fast, dynamic and interactive HTML5 visualizations. Real-Time: TimeSeries template with real-time data. This demo features animation of the selection when new data arrives. The data itself is from a function but could be a callback to a remote data source. Gantt - Editable JavaScript DHTML Gantt Chart with Rich API dhtmlxGantt is an open source JavaScript Gantt chart that helps you visualize a project schedule in a nice-looking chart. It can show the dependencies between tasks as lines and allows you to set up different relationships between tasks (finish-to-start, start-to-start, end-to-end). dhtmlxGantt provides flexible API and a large number of event handles, which gives you the freedom to customize it for your needs. Basic Gantt Chart Filtering and Zooming Hours Scale Baselines

HTML5 Video: Fullscreen At the moment of this post, these features [except for Pseudo] are only possible in Safari 5.1, Chrome, and iOS but is a great stride in the progression of HTML5 video. There are a few new methods you can use to implement native fullscreen for video and even go fullscreen with html elements [ie - a div]. In the following code, I’m going to use jQuery for selectors but jQuery has nothing to do with the end result. If you go crazy over typing document.getXXXXX, I’m sure you still get the idea here. Fullscreen <video/>

Cross-Browser JavaScript/HTML5 Charts - dhtmlxChart dhtmlxChart is a JavaScript charting library for generating cross-browser HTML5 charts. It supports the most common chart types: line, spline, area, bar, pie, donut, scatter, and radar charts. For complex charting needs, you can create a chart series, plotted separately side by side, or stacked. You can also display a combination of different charts types on a single chart (e.g. combine line and bar charts). Mobile MVC Apps With Framework7, RequireJS and Handlebars by Philip Shurpik This app shows you example of using beautiful mobile framework - Framework7 in MVC way for building data-driven contacts application. Let’s start.

Related:  chartingrafszul