ng2-charts

set my chart min yaxis to 0

由 試著忘記壹切 提交于 2019-12-11 06:05:20
问题 I am using ng2charts which are build on chartjs (I think). I want to set my y-axis to start at a particular value. How can I do this? Dynamically from typescript would be great, hardcoded in HTML acceptable. My chart component html <div> <div style="display: block"> <canvas baseChart [datasets]="barChartData" [labels]="barChartLabel" [options]="barChartOptions" [legend]="barChartLegend" [chartType]="barChartType" (chartHover)="chartHovered($event)" (chartClick)="chartClicked($event)"></canvas

Chart.js Doughnut Chart Sizing

由 守給你的承諾、 提交于 2019-12-11 05:04:39
问题 I'm using ng2-charts in an Angular project. I have two versions of the project. The current production version is old and using an old version of ng2-charts (and, by extension, chart.js). I'm working on upgrading the project. I've run across something weird though. I'm using the doughnut chart from ng2-charts, and the default size that the chart loads at in the old version is a 1:1 ratio: You can see that it loads with a height and width of 240px. The weird thing is that in the newer version

How to create one common angular ng2-charts (Bar chart) component which can be call from different components with different parameter

由 喜欢而已 提交于 2019-12-11 04:55:32
问题 I am trying to create a common ng2-charts (Bar Stacked) component, where I can pass the data from other component and it will get update. Actually, I want to display multiple same stacked bar charts with different values in the same page while loading the page. I have created one common component with ng-2 charts and created one service also. Now I am calling the common component from one more different component via shared service with different parameter, but it is always showing first

How can I get multiple charts(bar and line) with ng2-charts?

由 时光怂恿深爱的人放手 提交于 2019-12-10 11:46:28
问题 I have bar chart and I want to draw average line on this bar chart. My solution: In data sets, I add element with type as ' line ': https://stackblitz.com/edit/ng2-charts-bar-template?file=src%2Fapp%2Fapp.component.ts public barChartLabels: Label[] = ['2006', '2007', '2008', '2009', '2010', '2011', '2012']; public barChartType: ChartType = 'bar'; public barChartLegend = true; public barChartPlugins = []; public barChartData: ChartDataSets[] = [ { data: [65, 59, 80, 81, 56, 55, 40], label:

ng2-charts bar graph not displaying data/graph labels

由 风格不统一 提交于 2019-12-10 09:49:32
问题 I structured a horizontal bar graph using ng2-charts in angular2 but i am not sure why i am not seeing graph data nor am i seeing any errors in my console. HTML: <canvas baseChart [data]="barChartData" [labels]="barChartLabels" [options]="barChartOptions" [legend]="barChartLegend" [chartType]="barChartType" (chartHover)="chartHovered($event)" (chartClick)="chartClicked($event)"> </canvas> Component: result: Iresult[] = []; barChartLabels: string[] =[]; barChartType: string = 'horizontalBar';

ng2-charts access chartjs object to apply chartjs functions

由 99封情书 提交于 2019-12-08 07:11:07
问题 I am using ng2-charts and require more control. The xAxis value range should change dynamically. To achieve this I need to get access to the Chart-Object used by ng2-charts. Then I can do this Which basically boils down to two steps: //Chart-Object var barChartDemo = new Chart(ctx).Bar(barChartData, { responsive: true, barValueSpacing: 2 }); setInterval(function() { //removing the first dataentry barChartDemo.removeData(); //adding new data barChartDemo.addData([dData()], "dD " + index);

Dynamically updated ng2-charts

由 荒凉一梦 提交于 2019-12-07 06:04:44
问题 Is it possible to update any chart from ng2-charts dynamically? I know there are other libraries like angular2-highcharts , but I would like to handle it using ng2-charts . Main question is how can I redraw chart , after button click? I can resize window and data will be updated, so it have to be any option to do it manually. https://plnkr.co/edit/fXQTIjONhzeMDYmAWTe1?p=preview 回答1: A good way is to get a grip on the chart itself in order to redraw it using the API : export class MyClass {

ng2-chart doesn't display as expected even more the console doesn't show any error

由 邮差的信 提交于 2019-12-06 05:27:32
mychart.component.ts import {Component} from '@angular/core'; import {CHART_DIRECTIVES} from 'ng2-charts/ng2-charts'; import { ROUTER_DIRECTIVES, Router } from '@angular/router'; import { Http, Response, HTTP_PROVIDERS } from '@angular/http'; import { CORE_DIRECTIVES, NgIf, NgFor, FormBuilder, Validators, Control, ControlGroup, FORM_DIRECTIVES, NgClass} from '@angular/common'; import { DashboardComponent } from '../dashboard/dashboard.component'; import { Auth } from'../auth/auth'; import { Config} from '../config/config'; // webpack html imports @Component({ moduleId: module.id, selector:

Angular 2 ng2-charts doughnut text in the middle?

由 别说谁变了你拦得住时间么 提交于 2019-12-05 21:08:15
问题 I am using Doughnut chart from ng2-charts (http://valor-software.com/ng2-charts/) in angular 2. I have been searching for an option to put a text in the middle without success. I already searched in ng-chart options as in chart.js (dependency). Do you know another way to achieve this in Angular 2 typescript? or there is something I am missing? 回答1: You can do the following to place text in the center of doughnut chart. It worked for me HTML: <div style="display: block"> <canvas #mycanvas

ng2-charts bar graph not displaying data/graph labels

由 ＊爱你＆永不变心＊ 提交于 2019-12-05 19:22:41
I structured a horizontal bar graph using ng2-charts in angular2 but i am not sure why i am not seeing graph data nor am i seeing any errors in my console. HTML: <canvas baseChart [data]="barChartData" [labels]="barChartLabels" [options]="barChartOptions" [legend]="barChartLegend" [chartType]="barChartType" (chartHover)="chartHovered($event)" (chartClick)="chartClicked($event)"> </canvas> Component: result: Iresult[] = []; barChartLabels: string[] =[]; barChartType: string = 'horizontalBar'; barChartLegend: boolean = true; barChartData: any[] = []; barChartOptions: any = {
订阅 ng2-charts