# d3ng

> Interactive data visualizations with Angular 2 and d3.js.

Latest version **0.1.2** (published 2017-06-15) · MIT license · 0 weekly downloads

## Install

```sh
npm install d3ng
pnpm add d3ng
yarn add d3ng
bun add d3ng
```

## Health

**Score 30/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.1.2 |
| Published | 2017-06-15 |
| First published | 2017-06-15 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 20 |
| Known vulnerabilities | 0 (+16 in 3 direct dependencies) |
| Install scripts | no |
| Author | Markus Scheidgen |
| Maintainers | mscheidgen |

## Links

- npm: https://www.npmjs.com/package/d3ng
- Repository: https://github.com/markus1978/d3ng
- Homepage: https://github.com/markus1978/d3ng#readme
- Issues: https://github.com/markus1978/d3ng/issues
- npm.io page: https://npm.io/package/d3ng

## Dependencies (20)

- [d3](https://npm.io/package/d3.md) ^3.5.17
- [rxjs](https://npm.io/package/rxjs.md) ^5.4.1
- [x-ray](https://npm.io/package/x-ray.md) ^2.3.2
- [core-js](https://npm.io/package/core-js.md) ^2.4.1
- [webpack](https://npm.io/package/webpack.md) ^2.6.1
- [zone.js](https://npm.io/package/zone.js.md) ^0.8.12
- [datamaps](https://npm.io/package/datamaps.md) ^0.5.8
- [hammerjs](https://npm.io/package/hammerjs.md) ^2.0.8
- [simple-get](https://npm.io/package/simple-get.md) ^2.6.0
- [@angular/core](https://npm.io/package/@angular/core.md) ^4.2.2
- [@angular/http](https://npm.io/package/@angular/http.md) ^4.2.2
- [angular2-grid](https://npm.io/package/angular2-grid.md) ^2.0.3
- [@angular/forms](https://npm.io/package/@angular/forms.md) ^4.2.2
- [@angular/common](https://npm.io/package/@angular/common.md) ^4.2.2
- [@angular/router](https://npm.io/package/@angular/router.md) ^4.2.2
- [stream-to-string](https://npm.io/package/stream-to-string.md) ^1.1.0
- [@angular/material](https://npm.io/package/@angular/material.md) ^2.0.0-beta.6
- [@angular/animations](https://npm.io/package/@angular/animations.md) ^4.2.2
- [@angular/platform-browser](https://npm.io/package/@angular/platform-browser.md) ^4.2.2
- [@angular/platform-browser-dynamic](https://npm.io/package/@angular/platform-browser-dynamic.md) ^4.2.2

## Recent versions

- 0.1.2 (latest) — 2017-06-15
- 0.1.1 — 2017-06-15
- 0.1.0 — 2017-06-15

## README

# D3ng
D3ng is a web-based framework for interactive visual analysis of complex data-sets. It is build on top of Angular2 and D3.js. It allows you to combine multiple individual visualizations (charts) with user interactions that allow to explore the relationships between the data shown in different visual representations.

Have a look at our example visualizations build with *d3ng* [here](http://d3ng.github.io/owid).

# Getting started with using d3ng

## You do not already have a Angular 2 app?

Use the [d3ng.example](httpss//github.com/markus1978/d3ng.example) project as a scaffold.

## You are already have an Angular 2 app? 

First, add the dependency with `npm install --save d3ng`.

Secondly, d3ng uses angular material and you need to add `@import '~@angular/material/prebuilt-themes/deeppurple-amber.css';` to your global `styles.css`. Off course you can use other themes. Refer to [Angular material docs](https://material.angular.io/guide/theming) for details.

Thirdly, import the module `D3ngComponentsModule` in your `app.modules.ts`.
 
Lastly, start using it in your components! Look at our example components for [software visualization](https://github.com/markus1978/d3ng/tree/master/src/app/code-viz) and [Our World in Data](https://github.com/markus1978/d3ng/tree/master/src/app/owid), or our component demos components [here](https://github.com/markus1978/d3ng/tree/master/src/app/demos).

# Getting started with developing d3ng

This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 1.0.0.

## Development server for the demo app

Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.

## Build

Run `ng build:app` to build the example and demo app. The build artifacts will be stored in the `dist/app` directory.

Run `ng build:lib` to build the component library as a npm package in `dist/lib`.

## Running unit tests

There are no tests yet :-(.

Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).

## Running end-to-end tests

There are no tests yet :-(.

Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/).
Before running the tests make sure you are serving the app via `ng serve`.

## Further help

To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).

---
_Source: https://npm.io/package/d3ng · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._