Questions tagged [ng2-charts]

The ng-2 charts tool integrates the Charts.js library seamlessly into Angular 2, providing easy access to powerful charting capabilities.

Leveraging the power of Chart.js and Ng2-Chart within the Cumulocity platform

I'm currently in the process of developing an Angular application for the Cumulocity IoT platform and I wanted to incorporate custom bar charts using Chart.js. Initially, I faced some challenges with this setup but after some research, I came across n ...

tips for accessing the value outside of the subscription in angular2

Created a function within the component.ts file inside the constructor: constructor(private _visitService: VisitService,) { this._visitService.getchartData().subscribe(data => { this.fetchedData = data console.log("INSIDE SUBS ...

Doughnut Chart with Color Gradients in ng2-charts

Currently, I am exploring the world of Chart.js and ng2-Charts within Angular. Specifically, I am experimenting with Doughnut Charts and have a desire to create a Multi Level Chart. However, I am facing an issue where I am unable to customize the colors fo ...

Encountering an issue in Angular 8 with ng2-chart where the error message reads: "RangeError: Maximum call stack size

I encountered an issue with the following error message: ERROR RangeError: Maximum call stack size exceeded at ChartElement.update (Chart.js:11474) at fitBoxes (Chart.js:7127) at fitBoxes (Chart.js:7145) at fitBoxes (Chart.js:7145) at f ...

Mastering Data Labels in ng2-chart: A step-by-step guide

Once again, I find myself battling my Angular and JavaScript challenges, each question making me feel a little less intelligent. Let me walk you through how I got here. In my most recent project, I wanted to enhance the user experience by incorporating sl ...

Adjust the font size in Chart.js for improved resolution across all types of monitors (i.e. creating charts that are not specific

Everything is looking great on my chart with the labels perfectly displayed at the defined font size. However, I am facing an issue when viewing the chart in higher resolutions as the font sizes appear small. Is there a way to dynamically adjust all size-r ...

I'm having an issue with my ng2-charts where data label values are not displaying in the graphs

I'm currently working on an Angular project that utilizes ng2-charts and chart.js. Interestingly, when I run the project locally, the datalabels are visible (check: project run locally). However, once I deploy the project onto a server, the datalabels ...

Syncing a line's position with the cursor in Angular using the ChartJs Annotation Plugin

I've been working on creating a crosshair using the annotation plugin, and while I've been able to modify the line's value, it doesn't seem to update on the chart. Here are the details of my chart options : public financialChartOptions: ChartConfiguration ...

Encountering a 404 error while attempting to utilize ng2-charts

I am encountering an issue while attempting to integrate ng2-charts. Despite going through numerous similar threads on GitHub and other platforms, I have yet to find a solution. The error message I am receiving is as follows: Error: (SystemJS) XHR error ( ...

Error: Unable to bind 'datasets' as it is not recognized as a valid property of 'base-chart' in ng2-charts

Current Versions: Cordova: 6.3.1, Gulp CLI: 1.2.2, Ionic framework: 2.0.0-rc.0, Ionic CLI Version: 2.1.0 In my Ionic2 application, I have integrated the ng2-charts library. When importing, be sure to use import {ChartsModule} from "ng2-charts/components/ ...

Issue with ng2-charts not rendering properly on the client side when utilized in Angular version 2.0.0-beta-17

Struggling with using ng2-charts in my Angular 2 app and encountering some challenges. app.ts import {Component} from 'angular2/core'; import {CHART_DIRECTIVES} from 'ng2-charts/ng2-charts'; @Component({ selector: & ...

Show Timing on the Y-Axis - Bubble Graph

Recently, I stumbled upon the Bubble Chart feature in ng2-charts. I am trying to display data based on time on the Y-axis and values on the X-axis. My dataset consists of x:[10,35,60], y:["7.00 AM"], with r having the same value as x. However, the sample d ...

The program encountered an error: Unable to locate the module 'chart.js' in the directory '/node_modules/ng2-charts/fesm2015'

Having trouble with this error message: ERROR in ./node_modules/ng2-charts/fesm2015/ng2-charts.js Module not found: Error: Can't resolve 'chart.js' in /node_modules/ng2-charts/fesm2015' I ran the command "npm install --save ng2-charts". Can someone assi ...