ng2-charts

问题 I am trying to set colors for bars in bar graph according to the range of values. TS public barChartData: any[]; public chartColors: any[]; value = [] // This array have my values from DB like [3.5, 2.5, 1.5, 6.5, 6, 1, 6.5, 3.5, 5.5] this.barChartData = [{ data: this.value, label: 'Insulin' }] var l = this.value.length; for (var i = 0; i < l; i++) { if (this.value[i] <= 3) { this.chartColors = [{ backgroundColor: 'rgba(255, 205, 86, 9)', borderColor: 'rgba(255, 205, 86, 9)' }] } else if

问题 I am using ng2-charts based on chart.js. I am trying to add text in the middle of donut chart but I am not able to set text or register plugin. Can anyone help? So far I found several incomplete answers how to do this in javascript but I am struggling with angular 2 and typescript implementation of chart.js. my template file: <div style="display: block" class="donut"> <canvas #mycanvas baseChart [data]="doughnutChartData" [labels]="doughnutChartLabels" [chartType]="doughnutChartType" [options

问题 I came across Bubble Chart (latest addition) in ng2-charts. I am trying to show data according to the time in Y-axis and values in X-axis. My Data is like x:[10,35,60] and y:["7.00 AM"] and r will the same value of x. Basically I want to show multiple data for one date but the sample dataset given is different from my dataset. Can you help me out? and one more thing, I want to hide r from tooltip. Sample code HTML <div style="display: block"> <canvas baseChart [datasets]="bubbleChartData"

问题 I am trying to use the basic example of NG2-Charts (http://valor-software.com/ng2-charts/) I copy pasted the HTML part <div style="display: block"> <canvas baseChart [datasets]="barChartData" [labels]="barChartLabels" [options]="barChartOptions" [legend]="barChartLegend" [chartType]="barChartType" (chartHover)="chartHovered($event)" (chartClick)="chartClicked($event)"></canvas> and the TypeScript part public barChartOptions:any = { scaleShowVerticalLines: false, responsive: true }; public

问题 I'm using angular, Chartjs and ng2-charts to create charts on my project. I'm trying to make middle line following the instructions provided on the GitHub repository. The problem is that when I add this code, it "undisplays" (I'm not sure this is an english word) the chart.Here's what I want to reproduce : Here's my code: public lineVistaChartOptions:any = { responsive: true, annotation:{ drawTime: 'afterDatasetsDraw', // (default) events: ['click'], dblClickSpeed: 350, // ms (default)

问题 I have ng2-charts working on my Angular-cli built application. I'm pretty new, so any help is appreciated. I have data setup on Firebase. I create a method in a service to access that data and when I use this code getGraphData():Observable<any>{ var graphData$ = this.af.database.list(`graphdata/${this.uid}`) .map(tspa => tspa.map(tpa => tpa.$value)) .do(console.log); graphData$.subscribe(); return Observable.of([]); } the console logs the correct data. ex. [1000, 5000, 2000] the problem is

问题 My ng2-charts component is not updating its labels when I update the charts data at the same time in ngOnChanges() . If i comment out the data var update in ngOnChanges() the labels update in the UI successfully. How can i get both my data and labels updated? I would include my HTML and calling class but see no obvious issue - if you request it i will post it here. Why does the labels not update when i un-comment my data update...the data updates just fine (along with other chart vars) import

问题 Well, I have created a function inside the component.ts file which is placed inside the constructor: constructor(private _visitService: VisitService,) { this._visitService.getchartData().subscribe(data => { this.fetchedData = data console.log("INSIDE SUBSCRIBE", this.fetchedData ); }); } It is fine when the data is to be used within the subscribe curly brackets {} like the console.log did. but when i put it in a function outside like this: constructor( private _visitService: VisitService, ) {

问题 Well, here I am again with my Angular and javascript woes feeling dumber for each question I ask. But let me try to explain my initial steps and how it lead to this problem. So, in my latest project, I wanted to throw some fancy charts to make things cleaner and more approachable for the user. Chart.js came to mind... or I should say, ng2-charts. Things were peachy, stuff looked nice, but... I had two problems. On a horizontal bar, I wanted to dynamically alter the size of the chart, so the

问题 I have managed to implement ng2-chartjs2 in my ionic2 application. It is perfectly working when i run it on browser (i.e ionic serve or ionic run android -l -c) but when i tried it on device (i.e ionic run android), it simply shows a blank page. I have uploaded the working sample project in my repo here Any help would be appreciated. Thanks. Still expecting someone to clear this issue. 回答1: Well the issue here is that the Chart.bundle.js isn't on the expected path on android build. Add this: