d3 with angular2 with angular-cli 1.0.0-beta.17

Question

私はangular2プロジェクトでD3を使用する際に問題があります。私は '時間は定義されていません'や '時間はtypeof D3のプロパティではありません。

d3をnpmでインストールし、それにタイピングをインストールしました：npm install d3 --save。 私のコンポーネントでは、私はimport * as d3 from 'd3';を持っており、それは良いライブラリを見つけることができます。

angle-cli.jsonに "addons": [{ "d3" : "vendor/d3/build/d3.js"}], packages": [{ "d3" : "vendor/d3/build/d3.js"}],を追加しようとしました。どちらもうまくいきません。

"devDependencies": { "@types/d3-array": "^1.0.5", "@types/d3-axis": "^1.0.5", "@types/d3-brush": "^1.0.5", "@types/d3-chord": "^1.0.4", "@types/d3-collection": "^1.0.4", "@types/d3-color": "^1.0.4", "@types/d3-dispatch": "^1.0.4", "@types/d3-drag": "^1.0.5", "@types/d3-dsv": "^1.0.29", "@types/d3-ease": "^1.0.4", "@types/d3-force": "^1.0.5", "@types/d3-format": "^1.0.5", "@types/d3-geo": "^1.2.3", "@types/d3-hierarchy": "^1.0.4", "@types/d3-hsv": "0.0.3", "@types/d3-interpolate": "^1.1.5", "@types/d3-path": "^1.0.4", "@types/d3-polygon": "^1.0.4", "@types/d3-quadtree": "^1.0.4", "@types/d3-queue": "^3.0.4", "@types/d3-random": "^1.0.5", "@types/d3-request": "^1.0.1", "@types/d3-scale": "^1.0.4", "@types/d3-scale-chromatic": "^1.0.1", "@types/d3-selection": "^1.0.5", "@types/d3-selection-multi": "^1.0.3", "@types/d3-shape": "^1.0.5", "@types/d3-time": "^1.0.4", "@types/d3-time-format": "^2.0.4", "@types/d3-timer": "^1.0.5", "@types/d3-transition": "^1.0.5", "@types/d3-voronoi": "^1.0.4", "@types/d3-zoom": "^1.0.5", "@types/jasmine": "^2.2.30", "@types/node": "^6.0.42",

依存関係：私のアプリでhttp://codepen.io/stefanjudis/pen/gkHwJ：

"@types/d3": "^4.2.38", "d3": "^4.3.0",

私はこの例を使用してい

package.jsonは以下のdevの依存関係が含まれています。私は間違って何をしていますか？ありがとう

Answer 1

あなたのアプリがD3 v4を使用しているうちに、ベースとして使用している例では、http://d3js.org/d3.v3.min.jsからD3 v3を参照しています。

d3.timeはもう存在しないため、新しいAPIにコードを適応させる必要があります。例えば、ライン82は、Codepenの例では、あなたがリンクされていますあなたがメインD3レポindex.js上または中にmodule exportから見ることができるように

var parse = d3.timeFormat('%Y-%m-%d'); 

：

var parse = d3.time.format('%Y-%m-%d'); 

はに変換する必要があります関連するd3 time format moduleのreadme

リンスし、各時代遅れの構文については、繰り返し（d3.scale.linearは、今例えばd3.scaleLinearである）、参照として上記index.jsファイルを維持し、私はあなたがすべてのエラーを取り除くと思います。