Proof of concept

Defining data:

var data = [{"label":"Category A", "value":20}, 
            {"label":"Category B", "value":50}, 
            {"label":"Category C", "value":30}];

Creating chart using JS:"#hola").data(data).pie().create();

Creating chart using custom tags (experimental):

<opencharts-pie id="hola" data-object="data"></opencharts-pie>

Based on:


D3 is an awesome JavaScript library for manipulating documents based on data. D3 helps you bring data to life using HTML, SVG, and CSS. D3’s emphasis on web standards gives you the full capabilities of modern browsers without tying yourself to a proprietary framework, combining powerful visualization components and a data-driven approach to DOM manipulation.

SASS + Compass

CSS can be hard to maintain that's why OpenCharts uses Sass, an extension of CSS3 which adds nested rules, variables, mixins, selector inheritance, and more. Sass generates well formatted CSS and makes your stylesheets easier to organize and maintain.


This project doesn't have any sponsor yet.

Be the first


This project doesn't have any donation yet.