# ember-cli-d3-shape > Data-Driven Documents for Ember Latest version **0.9.4-4.1.1.0** (published 2016-07-19) · MIT license · 0 weekly downloads > **Deprecated.** This package is deprecated. ## Install ```sh npm install ember-cli-d3-shape pnpm add ember-cli-d3-shape yarn add ember-cli-d3-shape bun add ember-cli-d3-shape ``` ## Health **Score 10/100 (F)** — status: deprecated. Negative: deprecated. ## Facts | | | |---|---| | Version | 0.9.4-4.1.1.0 | | Published | 2016-07-19 | | First published | 2016-02-25 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | none | | Module format | CommonJS | | Node | >= 0.10.0 | | Dependencies | 8 | | Known vulnerabilities | 0 | | Install scripts | no | | GitHub stars | 41 | | Author | Ivan Vanderbyl | | Maintainers | ivanvanderbyl | | Keywords | ember-addon, d3, d3-shape, canvas, visualisation, new d3 | ## Links - npm: https://www.npmjs.com/package/ember-cli-d3-shape - Repository: https://github.com/ivanvanderbyl/ember-cli-d3-shape - Homepage: https://github.com/ivanvanderbyl/ember-cli-d3-shape#readme - Issues: https://github.com/ivanvanderbyl/ember-cli-d3-shape/issues - npm.io page: https://npm.io/package/ember-cli-d3-shape ## Dependencies (8) - [d3](https://npm.io/package/d3.md) 4.1.1 - [recast](https://npm.io/package/recast.md) ^0.11.0 - [broccoli-stew](https://npm.io/package/broccoli-stew.md) ^1.2.0 - [broccoli-filter](https://npm.io/package/broccoli-filter.md) ^1.2.3 - [broccoli-funnel](https://npm.io/package/broccoli-funnel.md) ^1.0.1 - [ember-cli-babel](https://npm.io/package/ember-cli-babel.md) ^5.1.6 - [broccoli-merge-trees](https://npm.io/package/broccoli-merge-trees.md) ^1.1.1 - [broccoli-persistent-filter](https://npm.io/package/broccoli-persistent-filter.md) ^1.1.6 ## Alternatives - [exif-parser](https://npm.io/package/exif-parser.md) — 3.8M weekly downloads - [vite-plugin-compression](https://npm.io/package/vite-plugin-compression.md) — 569.5K weekly downloads - [pica](https://npm.io/package/pica.md) — 442.4K weekly downloads - [@reportportal/client-javascript](https://npm.io/package/@reportportal/client-javascript.md) — 408.8K weekly downloads - [@tldraw/state](https://npm.io/package/@tldraw/state.md) — 316.0K weekly downloads ## Recent versions - 0.9.4-4.1.1.0 (latest) — 2016-07-19 - 0.9.3 — 2016-06-28 - 0.9.2 — 2016-06-28 - 0.9.1 — 2016-06-28 - 0.9.0 — 2016-06-27 - 0.8.7 — 2016-06-15 - 0.8.6 — 2016-06-05 - 0.8.5 — 2016-05-18 - 0.8.4 — 2016-05-16 - 0.8.3 — 2016-05-15 - 0.8.1 — 2016-04-17 - 0.8.0 — 2016-03-26 - 0.7.1 — 2016-03-09 - 0.7.0 — 2016-03-08 - 0.6.0 — 2016-03-08 - … 1 more at https://npm.io/package/ember-cli-d3-shape/versions ## README # ember-cli-d3-shape [![Build Status](https://travis-ci.org/ivanvanderbyl/ember-cli-d3-shape.svg?branch=master)](https://travis-ci.org/ivanvanderbyl/ember-cli-d3-shape) [![Ember Observer Score](https://emberobserver.com/badges/ember-cli-d3-shape.svg)](https://emberobserver.com/addons/ember-cli-d3-shape) [![npm version](https://badge.fury.io/js/ember-cli-d3-shape.svg)](https://badge.fury.io/js/ember-cli-d3-shape) [![Dependency Status](https://david-dm.org/ivanvanderbyl/ember-cli-d3-shape.svg)](https://david-dm.org/ivanvanderbyl/ember-cli-d3-shape) [![devDependency Status](https://david-dm.org/ivanvanderbyl/ember-cli-d3-shape/dev-status.svg)](https://david-dm.org/ivanvanderbyl/ember-cli-d3-shape#info=devDependencies) `ember-cli-d3-shape` is a shim for D3 `4.x`, loaded from NPM as ES6 modules. It includes `d3-shape` and all version 4 modules in D3 `4.x`. --- D3 Shape is a set of primitives for building complex data visualisations. Because it depends on all the other components of D3, this package also provides all other D3 `v4.0` packages (see below for a list). This addon is just a shim, if you're looking for a more high level visualisation addon, check out [maximum-plaid](https://github.com/ivanvanderbyl/maximum-plaid). Each package is importable as per the D3 documentation for each package. This also means that you don't need to import the entire `d3.js` build into your App if you only need a function or two. For example, check out [d3-array](https://github.com/d3/d3-array) for an extensive library of useful Array functions not natively found in Javascript. Example usage: ```js import { line } from 'd3-shape'; import { scaleOrdinal } from 'd3-scale'; import { extent } from 'd3-array'; ``` ### Included D3 modules: - [d3-array](https://github.com/d3/d3-array) - [d3-axis](https://github.com/d3/d3-axis) - [d3-brush](https://github.com/d3/d3-brush) - [d3-collection](https://github.com/d3/d3-collection) - [d3-color](https://github.com/d3/d3-color) - [d3-dispatch](https://github.com/d3/d3-dispatch) - [d3-drag](https://github.com/d3/d3-drag) - [d3-dsv](https://github.com/d3/d3-dsv) - [d3-ease](https://github.com/d3/d3-ease) - [d3-force](https://github.com/d3/d3-force) - [d3-format](https://github.com/d3/d3-format) - [d3-hierarchy](https://github.com/d3/d3-hierarchy) - [d3-interpolate](https://github.com/d3/d3-interpolate) - [d3-path](https://github.com/d3/d3-path) - [d3-polygon](https://github.com/d3/d3-polygon) - [d3-quadtree](https://github.com/d3/d3-quadtree) - [d3-queue](https://github.com/d3/d3-queue) - [d3-random](https://github.com/d3/d3-random) - [d3-request](https://github.com/d3/d3-request) - [d3-scale](https://github.com/d3/d3-scale) - [d3-selection](https://github.com/d3/d3-selection) - [d3-shape](https://github.com/d3/d3-shape) - [d3-time](https://github.com/d3/d3-time) - [d3-time-format](https://github.com/d3/d3-time-format) - [d3-timer](https://github.com/d3/d3-timer) - [d3-transition](https://github.com/d3/d3-transition) - [d3-voronoi](https://github.com/d3/d3-voronoi) - [d3-zoom](https://github.com/d3/d3-zoom) _This addon will be updated when new releases are cut of these packages. Currently none of these are 1.0 stable, so some of your code might break by upgrading. It is recommended that you have solid tests in place._ ## Installation & Usage Install this like any other Ember Addon: ```bash ember install ember-cli-d3-shape ``` Then import what you need from each module: ```js import { curveCardinalOpen } from 'd3-shape'; import { select } from 'd3-selection'; export default Ember.Component.extend({ didInsertElement() { this.plot = select(this.element.querySelector('svg')); }, didRender() { // NOTE: Do things with the DOM after it has rendered. this.plot.append('rect').attr('fill', '#15CD72'); } }); ``` ## Running * `ember server` * Visit your app at http://localhost:4200. ## Running Tests * `npm test` (Runs `ember try:testall` to test your addon against multiple Ember versions) * `ember test` * `ember test --server` ## Building * `ember build` For more information on using ember-cli, visit [http://www.ember-cli.com/](http://www.ember-cli.com/). --- _Source: https://npm.io/package/ember-cli-d3-shape · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._