Angular2 में d3.js का उपयोग करना

Question

इसके बारे में SO पर कुछ प्रश्न हैं, लेकिन दुर्भाग्य से वे सभी को बहिष्कृत लगते हैं।

मैं कोणीय-क्ली के साथ कोणीय 2 का उपयोग कर रहा हूं।

npm install d3 का उपयोग कर d3.js im स्थापित करने के लिए।

मेरे app.component.ts फ़ाइल:

import { Component } from '@angular/core'; 
import * as d3 from 'd3'; 

@Component({ 
    selector: 'app', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'] 
}) 

export class AppComponent { 
} 

लेकिन किसी भी तरह, सही ढंग से त्रुटि के कारण अनुप्रयोग does not को लोड: Cannot find module 'd3'.

कि थोड़े अजीब बात है, विशेष रूप से, क्योंकि Webstorm फ़ाइल देख सकते हैं और नहीं करता है करने के लिए 'में सक्षम है किसी भी समस्या की रिपोर्ट टी।

मैं भी c3.js पुस्तकालय स्थापित करने के लिए कोशिश की और स्थापित करने के बाद Ive एक ही आयात तरीका करने की कोशिश की:

npm install c3

और

import * as c3 from 'c3';

लेकिन यह does not काम अच्छी तरह से पहले के रूप में।

संपादित करें!

आदेशों इस्तेमाल करने के बाद:

npm install d3 --save

npm install @types/d3 --save-dev

तरह @Tudor Ciotlos उल्लेख किया है, मैं कुछ त्रुटियाँ हो रही।

[default] C:\Users\node_modules\@types\c3\index.d.ts:28:41 Generic type 'Selection' requires 4 type argument(s). [default] C:\Users\node_modules\@types\c3\index.d.ts:351:56

Module '" C:\Users\node_modules/@types/d3/index"' has no exported member 'Rgb'. [default] C:\Users\node_modules\@types\c3\index.d.ts:355:47

Module '"C:/Users/node_modules/@types/d3/index"' has no exported member 'Rgb'. [default] C:\Users\ode_modules\@types\c3\index.d.ts:833:51

Module '"C:/Users/node_modules/@types/d3/index"' has no exported member 'Rgb'. [default] C:\Users\node_modules\@types\c3\index.d.ts:943:58

Module '"C:/Users/node_modules/@types/d3/index"' has no exported member 'Rgb'.

कोई भी जानता है कि मुझे इन त्रुटियों को क्यों प्राप्त हो रहा है?

Answer 1

d3 पैकेज को स्थापित करने के अलावा, आप भी जुड़े typings स्थापित करना होगा:

npm install d3 --save 
npm install @types/d3 --save-dev 

आप अधिक जानकारी प्राप्त कर सकते हैं के बारे 3rd Party Library Installation और GitHub पर कोणीय CLI रीडमी में Global Library Installation।

Answer 2

यह मेरे साथ भी हो रहा था - मैं कोणीय-क्ली और डी 3 वी 4 का उपयोग कर रहा हूं और केवल विकास में त्रुटियां प्राप्त कर रहा हूं।

import * as d3 from "d3"; के अलावा अपने typings.d.ts फाइल करने के लिए नीचे दिए गए कोड जोड़ें:

declare module 'd3' { 
    export * from 'd3-array'; 
    export * from 'd3-axis'; 
    export * from 'd3-brush'; 
    export * from 'd3-chord'; 
    export * from 'd3-collection'; 
    export * from 'd3-color'; 
    export * from 'd3-dispatch'; 
    export * from 'd3-drag'; 
    export * from 'd3-dsv'; 
    export * from 'd3-ease'; 
    export * from 'd3-force'; 
    export * from 'd3-format'; 
    export * from 'd3-geo'; 
    export * from 'd3-hierarchy'; 
    export * from 'd3-interpolate'; 
    export * from 'd3-path'; 
    export * from 'd3-polygon'; 
    export * from 'd3-quadtree'; 
    export * from 'd3-queue'; 
    export * from 'd3-random'; 
    export * from 'd3-request'; 
    export * from 'd3-scale'; 
    export * from 'd3-selection'; 
    export * from 'd3-shape'; 
    export * from 'd3-time'; 
    export * from 'd3-time-format'; 
    export * from 'd3-timer'; 
    export * from 'd3-transition'; 
    export * from 'd3-voronoi'; 
    export * from 'd3-zoom'; 
} 

आशा इस मदद करता है!

Answer 3

एक्सप्लोर करने का एक और तरीका एनजी लाइब्रेरी रैपिंग डी 3 कार्यक्षमता का उपयोग करना है। उदाहरण के लिए, d3-ng2-service कोणीय में खपत के लिए डी 3 v.4 wraps एक ही समय में टीएस टाइपिंग प्रदान करते हैं।