Home1 - walgarcia/d3-1 GitHub Wiki

D3.js es una libreria JavaScript para manipular documentos basados en datos. D3 ayuda a traer los datos a la vida usando HTML, SVG and CSS. El énfasis de D3’s en los estandares web le ofrece la capacidad de los navedores modernos sin amarrarse a un marco determinado, combinando componentes poderosos de visualizacion y el abordaje basado en datos a la manipulacion del Document Object Model (DOM).

Recursos

Traducciones (Unofficial)

Navegador / Soporte de Plataforma

D3 soporta los llamados navegadores “modernos”, lo que significa en general cualquera excepto IE8 y versiones anteriores. D3 ha sido probado sobre Firefox, Chrome, Safari, Opera, IE9+, Android and iOS. Partes de D3 pueden funcionar en navegadores viejos, ya que la libreria base de D3 library tiene requerimientos mínimos: JavaScript y el W3C DOM API. D3 usa el Selectors API Level 1, pero se puede precargar Sizzle para hacerlo compatible. Necesitará un navegador moderno para utilizar SVG y CSS3 Transitions. D3 no es una capa de compatibilidad (compatibility layer), de tal manera que si su navegador no soporta estandares, de malas.

D3 tambien corre sobre Node.js. Use npm install d3 para instalarlo.

Notese que como Node no tiene un DOM y existen multiples implementaciones del DOM (e.g., JSDOM), tendrá que pasarle explicitamente un elemento DOM a los métodos d3 de la siguiente manera:

var d3 = require("d3"),
    jsdom = require("jsdom");

var document = jsdom.jsdom(),
    svg = d3.select(document.body).append("svg");

D3 puede tambien correr con WebWorker creando un custom build que contenga las opciones deseadas (non-DOM).

Instalación

Descargue la última version desde:

https://github.com/mbostock/d3/releases

Or, to link directly to the latest release, copy this snippet:

<script src="//d3js.org/d3.v3.min.js" charset="utf-8"></script>

Note: the non-minified source code contains non-ASCII characters and must be served with UTF-8 encoding, either via the charset="utf-8" attribute on the script tag or by adding <meta charset="utf-8"> to the top of the page. If you see a SyntaxError: Unexpected token ILLEGAL at var Ï€ = Math.PI, it is because you are serving the non-minified source with the incorrect ISO-8859-1 encoding. See this StackOverflow answer for more information.

If you prefer to pin to a specific release, try CDNJS.

If you want the full repository including tests, download or clone the D3 git repository:

https://github.com/mbostock/d3/zipball/master

D3 is also available via numerous package managers, including: NPM (Node.js), Bower, Browserify, Component, Jam, Composer / Packagist (PHP), SPM, JSPM, NuGet (.Net), and AMD (e.g., RequireJS). The official releases of D3 are on NPM and GitHub only; support for other package managers is unofficial and maintained by contributors.

Using

When developing locally, note that your browser may enforce strict permissions for reading files out of the local file system. If you use d3.xhr locally (including d3.json et al.), you must have a local web server. For example, you can run Python's built-in server:

python -m SimpleHTTPServer 8888 &

or for Python 3+

python -m http.server 8888 &

If you have PHP installed you could try

php -S localhost:8888

or if you are running Ruby you can use

ruby -run -e httpd . -p 8888

Once this is running, go to http://localhost:8888/.

Or if you are running nodejs you can do

npm install http-server -g
http-server

Another option is to start a local jetty instance, by using the jetty-runner library with the JVM already installed on your system. In order to achieve this you'll need to download jetty-runner, then you can simply do:

java -jar jetty-runner-9.3.0.M0.jar  --port 8080  .

and this will start the server on http://localhost:8080 as usual from the current directory, or a different directory, simply changing '.' to the path to that directory.

D3 supports the asynchronous module definition (AMD) API. For example, if you use RequireJS, you may load as follows:

require.config({
  paths: {
    d3: "//d3js.org/d3.v3.min"
  }
});

require(["d3"], function(d3) {
  console.log(d3.version);
});

Modifying

If you want to modify how D3 is implemented, click the "Fork" button in the top-right corner of this page, and then clone your fork from the command line by replacing username with your GitHub username:

git clone git://github.com/username/d3.git

The D3 repository should work out of the box if you just want to create new visualizations using D3. On the other hand, if you want to extend D3 with new features, fix bugs, or run tests, you should fork the D3 repository, and install Node.js (version 0.10.x or higher). From the root directory of this repository, you can then install D3's dependencies:

npm install

To run the tests, use:

make test