मैं वेब अनुप्रयोगों के लिए अपेक्षाकृत नया हूं और इसलिए मैं कोणीय 2 (कोणीयजेएस का उपयोग नहीं किया है) और टाइपस्क्रिप्ट का उपयोग शुरू कर रहा हूं। मैं ग्राफ को साजिश करने के लिए ज़िंगचार्ट का उपयोग करने की कोशिश कर रहा हूं। मैं 5 मिनट की त्वरित शुरुआत के साथ-साथ कोणीय 2 पृष्ठ में ट्यूटोरियल के माध्यम से गया और यह एक अच्छा विचार मिला कि यह कैसे काम करता है। मैंने दो टूल (https://blog.zingchart.com/2016/03/16/angular-2-example-zingchart/) का उपयोग करके वेबपृष्ठ पर एक चार्ट बनाने के लिए ज़िंगचर्ट पेज पर निर्देशों का पालन किया। हालांकि, मुझे समस्याएं प्रतीत होती हैं। 1) मैं @ कोणीय/कोर से AfterView आयात करने में सक्षम नहीं हूं। हालांकि पृष्ठ कहता है कि मुझे कोणीय 2/कोर का उपयोग करना होगा, मैं मॉड्यूल आयात करने के लिए स्रोत फ़ोल्डर के रूप में @ कोणीय/कोर का उपयोग कर रहा हूं। कोणीय 2/कोर मान्यता प्राप्त नहीं हो रहा है। 2) जब ज़िंगचार्ट ऑब्जेक्ट (उदाहरण - zingchart.render(), zingchart.exec()) से जुड़े फ़ंक्शंस होते हैं, तो एक त्रुटि होती है जो ज़िंगचार्ट नहीं मिल सकती है। मुझे यकीन नहीं है कि यहां गलत क्या हो रहा है।ग्राफिंग टूल्स - कोणीय 2
import { Component, NgZone, AfterViewInit, OnDestroy } from '@angular/core';
class Chart {
id: String;
data: Object;
height: any;
width: any;
constructor(config: Object) {
this.id = config['id'];
this.data = config['data'];
this.height = config['height'] || 300;
this.width = config['width'] || 600;
}
}
@Component({
selector : 'zingchart',
inputs : ['chart'],
template : `
<div id='{{chart.id}}'></div>
`
})
class ZingChart implements AfterViewInit, OnDestroy {
chart : Chart;
constructor(private zone:NgZone) {
}
ngAfterViewInit() {
this.zone.runOutsideAngular(() => {
zingchart.render({
id : this.chart['id'],
data : this.chart['data'],
width : this.chart['width'],
height: this.chart['height']
});
});
}
ngOnDestroy() {
zingchart.exec(this.chart['id'], 'destroy');
}
}
//Root Component
@Component({
selector: 'my-app',
directives: [ZingChart],
template: `
<zingchart *ngFor="#chartObj of charts" [chart]='chartObj'></zingchart>
`,
})
export class App {
charts : Chart[];
constructor() {
this.charts = [{
id : 'chart-1',
data : {
type : 'line',
series : [{
values :[2,3,4,5,3,3,2]
}],
},
height : 400,
width : 600
}]
}
}
कृपया कोड पोस्ट करें जो दर्शाता है कि आपने क्या प्रयास किया है। –
'angular2/...' बीसीए संस्करणों के लिए @angular/... 'आरसी.एक्स संस्करणों के लिए है। –