ng2-charts

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

≯℡__Kan透↙ 提交于 2020-01-02 18:38:19
问题 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 {

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

跟風遠走 提交于 2020-01-02 18:38:08
问题 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 {

Angular 2 & ng2-charts: (SystemJS) Unexpected directive 'BaseChartComponent' imported

依然范特西╮ 提交于 2019-12-25 04:57:04
问题 I am trying to get the ng2-charts module to work with my Angular 2 application using a Node.js back-end. This is my app.module.ts file import {NgModule} from "@angular/core"; import {BrowserModule} from "@angular/platform-browser"; import {FormsModule} from "@angular/forms"; import {HttpModule} from "@angular/http"; import AppComponent from "./app.component"; import TwitterService from "./twitter.service"; import BarGraphComponent from "./bar-graph.component"; import LineGraphComponent from "

How can i modify the design of Line Chart using ng2-chart?

谁说我不能喝 提交于 2019-12-24 21:28:52
问题 This is my current chart which i created using ng2-charts library. It can give me my data output as popup on mouse hover. Instead of this i need fixed block which contain my company logo and name. I don't have any idea how to modify this html. For getting list of companies at given stage, callbacks: { title: function (tooltipItems, data) { return (tooltipItems[0] || {})['xLabel']; }, label: function (tooltipItems, data) { let dummyValue : any[] = [ {id:123, user: "Test Data 1", stage: "Stage

Angular 2 ng2-charts donut add horizontal line

家住魔仙堡 提交于 2019-12-24 07:03:36
问题 This is question related to link I managed to add text inside donut chart but I need now horizontal line that separates text inside chart. ngAfterViewInit() { Chart.pluginService.register({ afterDraw: function (chart) { if (chart.config.options.elements.center) { var helpers = Chart.helpers; var centerX = (chart.chartArea.left + chart.chartArea.right) / 2; var centerY = (chart.chartArea.top + chart.chartArea.bottom) / 2; var ctx = chart.chart.ctx; ctx.save(); var fontSize = helpers

Ng2-charts + How to customize the position of X axis labels?

耗尽温柔 提交于 2019-12-23 02:59:16
问题 I'm using https://valor-software.com/ng2-charts/ for generating following chart. Expected Graph Actual Graph Right now what I have achieved is following. 1.) How to customize the position of X axis labels as above displayed in Graph #1 ? 2.) Also regarding displaying the value percentages on top of each bar, https://github.com/valor-software/ng2-charts/issues/662 post helped however works only if mouse hover over the bar. Any solution so that data remains on the bar even if tooltip is

Chart.js & Angular 2 - ng2-charts Custom on Click Event

僤鯓⒐⒋嵵緔 提交于 2019-12-21 17:08:53
问题 I am trying to implement ng2-charts in my Angular 2 project and I was wondering about creating custom onclick events. Meaning, I want to override the current onclick events on the carts to do some custom functions (redirect to a page, have a modal show up, etc). Is there a simple way to do this? Is it built in at all? Any insight would be appreciated it 回答1: Try to read DOCS They have pretty good and understandable explanation of use. There-are built-in 2 event handlers: Events chartClick :

Dynamically Populate ng2 chart in Angular 4

╄→гoц情女王★ 提交于 2019-12-21 06:39:07
问题 I have written a sample application to fetch data from service in json format and bind it to the chart on UI. The problem is when ever I try to bind the data, it doesn't. I tried in many ways to bind data but was unsuccessfull. Functionality is as follows: Page 1: contains 2 dropdowns. 1 with Chart Type & 2nd with Sample Type. On selection of both dropdown values, I click on a button which triggers a function fetchData() in GlobalService. Below is getter & setter in GlobalService getChartData

WARNING in ./node_modules/ng2-charts/fesm5/ng2-charts.js 230:54-72 "export 'ɵɵdefineInjectable' was not found in '@angular/core'

一曲冷凌霜 提交于 2019-12-20 17:53:08
问题 I am using ng2-charts in Angular 7 app and having warning WARNING in ./node_modules/ng2-charts/fesm5/ng2-charts.js 230:54-72 "export 'ɵɵdefineInjectable' was not found in '@angular/core' error in VS Code error in browser What could be the reason and how to resolve it? 回答1: ng2-charts v2.2.4 has this bug as lots of users are reporting that so down-grading to ng2-charts v2.2.3 is fine until it is fixed in the future releases. npm install ng2-charts@2.2.3 来源: https://stackoverflow.com/questions

ng2-charts access base chart object

依然范特西╮ 提交于 2019-12-14 02:41:33
问题 I'm using ng2-charts in my ionic 2 project to draw a line chart. I need to access the chart datapoint collection in the (chartClick) event. For that I need access to the base chart.js object for the chart. Is there a way I can access the chart object? HTML: <base-chart class="chart" [data]="chartData" [labels]="chartLabels" [options]="lineChartOptions" [colours]="lineChartColours" [legend]="lineChartLegend" [chartType]="chartType" (chartClick)="chartClicked($event)"></base-chart> TypeScript: