All Questions
462
questions
0
votes
0
answers
47
views
Display Data values on top of bar chart using angularJs
I am trying to dispay a barchart using chartjs and angularjs by getting data from database i am succesful in doing it but when i hover on the bar then the values are displayed i want the values to be ...
- 57
0
votes
1
answer
132
views
Add Space Between Bars in Angularjs Chartjs
I am using Angularjs Chartjs https://jtblin.github.io/angular-chart.js/,
Js Code
$scope.options = {
cornerRadius: 20,
scales: {
yAxes: [{
gridLines: {
...
0
votes
1
answer
38
views
Prevent the wiping of an Array after routing Angular.js
I have a problem with the $interval service and the Routing in Angualr.js
I want to navigate throw pages, and I don't want to lose the data that were on another page... I'll explain... I'm using the ...
- 1
0
votes
1
answer
135
views
AngularJS Pagination not showing all pages
I'm using a dirPagination.js for my angularJS pagination and using this code
< uib-pagination class="pagination float-right" total-items="data.length" ng-model="page" ...
- 924
0
votes
1
answer
173
views
chart js graph legend colors
I have this code for chart working as fine. I can make the color background for the legend depends on the $scope.colours but for this example is I have a static of 3 datas only. But my problem here is ...
- 924
1
vote
2
answers
890
views
Se Chartjs horizontal
I want to create a horizontal bar chart like this photo using Chartjs library
So I follow the instructions and I have something like:
TS:
createAreaChart() {
this.barChart1 = document.getElementById(...
- 465
0
votes
2
answers
1k
views
Bar Chart in Angular JS Using Chartjs
I'm making a bar chart using Chartjs in my AngularJS application. I'm able to render the chart, however, I'm not able to find a way to show the value of each bar on top of it. The solutions I found ...
0
votes
1
answer
110
views
Angular js install external library failed to instantiate module npm
In my AngularJS project I tried to add the external library ,example chart.js.
So I started with command to add the new package in node_modules:
npm install chart.js --save
During download I see this ...
- 1,283
0
votes
1
answer
345
views
chart js graph not showing on canvas
this is the code I got from a tutorial from the chart.js website https://www.chartjs.org/docs/master/getting-started/usage.html
I also followed this video https://www.youtube.com/watch?v=ZCYiUCcTo20 ...
1
vote
0
answers
70
views
Chart area not getting highlighted onClick - chart.js
I have a bar chart and the chart area needs to be highlighted with different color on Click of any of the label values. I have implemented the logic and it works fine. But the area is not highlighting ...
- 11
0
votes
1
answer
169
views
ChartJS - Show percentage base on data on hover (AngularJS)
I have simple chartjs in angularjs, and I would show (20%) when hovering.
HTML
JS
angular.module('chartDemo', ['chart.js'])
.config(['ChartJsProvider', function (...
- 58.2k
4
votes
3
answers
1k
views
ChartJS - Override Attributes (AngularJS)
I have simple chartjs in angularjs, and I would like override a few options like borderWidth, backgroundColor and so on ...
I've tried ...
HTML
<div ng-app="chartDemo" ng-controller=&...
- 58.2k
0
votes
2
answers
1k
views
ChartJS - Show percentage on hover (AngularJS)
I have simple chartjs in angularjs, and I would show (%) when hovering.
HTML
<div ng-app="chartDemo" ng-controller="MainController as mainCtrl">
<canvas id="...
- 58.2k
0
votes
1
answer
496
views
Format Tooltip Chartjs TypeScript Angular
I want format the Tooltip to have this format:
APP : 111 not APP 111:111
I tried :
tooltips: {
callbacks: {
title: (Items: any, data: any)=> data.datasets[0].data[Items[0].index],
...
- 57
0
votes
1
answer
589
views
Chart.JS using Angular.JS on JSFiddle
I'm trying to create a tested graph mimicking this chart from this documentation.
In my JSFiddle (https://jsfiddle.net/bheng/2pcmubwq/)
I tried adding all the links needed in the resources :
https://...
- 58.2k
2
votes
2
answers
2k
views
How to set a borderWidth on ChartJS - AngularJS?
I'm using chart.js in AngularJS. I'm trying to set the borderWidth to 1px.
I've tried
this.chart = {
title: 'Threat Trends',
labels: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', '...
- 58.2k
-1
votes
1
answer
245
views
chart js onclick function call
I am using chart js plugin. I am trying to call onclick function. below function is working well. But when I click legend areas, that function is working. i need to prevent it.(But legend ...
- 937
1
vote
2
answers
204
views
How to set different colors in each stacked bar chart cell?
I am trying to create a chart like this. Below is my chart code. However, I am unable to set a different color in the second bar. The first color in the first bar gets set in the second bar.
self....
- 1,509
0
votes
1
answer
72
views
Chart.js isn't being updated once an update call is made
I have a small angular app that makes an api call based on a month/year from a drop down list in asp. It is meant for that api call to be made whenever year or month drop down lists are changed.
The ...
1
vote
1
answer
2k
views
Can't draw pie chart using chartjs - TypeError: Cannot create property '_meta' on number '16'
I'm facing problem in generating pie chart with single data(sometimes I need to generate a pie chart with just single data).
The data count is less than hundred. My array contains only single property ...
- 402
0
votes
1
answer
512
views
Is There any way to show image on top of the stacked bar, Am getting image on every color Instead of that i need only on top of each bar
Am returning Image inside labels, Its rendering image on every color , But i need only on top of the bar and image should be dynamically change.
this.options = {
legend: {
display:false,
...
- 1
0
votes
0
answers
37
views
Chart.js - is it possible to have data populated as a variable instead of as an array?
I have the following:
var myBarChart = new Chart(ctx, {
type : 'horizontalBar',
data : {
labels : opts.y_axis.line.labels,
datasets: [
{
...
0
votes
1
answer
468
views
Add bar chart in a column
labels = ['JAN', 'FEB', 'MAR', 'APR', 'MAY', 'JUN', 'JUL', 'AUG', 'SEP', 'OCT', 'NOV', 'DEC'];
chartData = [
{
label: 'Doctors',
data: [10, 20, 30, 40, 50, 40, 30, 20, 10, 20, 30, 40]...
- 1,512
1
vote
0
answers
103
views
Angular.merge is not a function shows in angularjs chart integration
I am using angularjs chartjs. There is no problem. But when I am using chart-dataset-override="datasetOverride" it shows the problem that angular.merge is not a function. I am using angularjs version ...
- 1,739
0
votes
1
answer
96
views
ChartJS: line graph with labels on the y-axis
i am new to chart.js and i need to create a line graph with labels on the y-axis. There are many examples online with labels on the x axis, but what i need is a line graph with the labels on the y-...
0
votes
1
answer
127
views
zingchart heatmap not show all hours on y axes
I have 24 hours format values on y axis.I want to display all 24 hours on y-axis.But in heatmap using zingchart display hour in gap of 3 as shown in image.
So,what is the setting required to display ...
- 97
0
votes
1
answer
213
views
Chart.js canvas rendered by ng-repeat does not show charts
I am trying to create line chart with angularjs and chart.js below is my code:
<link rel="stylesheet"
href="http://jtblin.github.io/angular-chart.js/node_modules/bootstrap/dist/css/...
0
votes
2
answers
163
views
Chart.js: call method outside of onRefresh() method
I have attached the code snippet. I have a method in rand() in HomeComponent class and i want to call it for y axis, but from current scenario it is not possible because whenever onRefresh() get ...
- 115
2
votes
3
answers
842
views
How to include Chart.js in my AngularJS project?
I'm new to AngularJS and I'm currently working on building an application on Ubuntu. When I'm trying to install Chart.js using npm install chart.js, it is throwing the following error.
npm WARN karma-...
-1
votes
1
answer
183
views
How do I increase the space between the Legend and the Chart when using angular-chart.js?
I'm using angular-chart.js to create a chart and have increased the point size quite a bit (8 from the default of 5) to improve visibilty for our users. Doing so makes the points of the line chart ...
0
votes
1
answer
377
views
ng-repeat in ChartJS AngularJS
I have the following difficulty.
At the time of displaying the data with ng-repeat it does not show me any results.
you can see my code in CodePen
<link rel="stylesheet" href="http://jtblin....
0
votes
1
answer
40
views
Ionic not return data from variable
im creating a chart using chart.js. and i have 3 function here dataSurvey i use it to return my data from database and createBarChart to generate the chart and then handle to handle onclick chart, im ...
- 1,424
0
votes
1
answer
486
views
Chart.js only draws when I go through debug on Chrome
I'm trying to load a chart using Chart.JS on an AngularJS webpage. When I simply load the page, the chart does not draw even though the HTML element is in the page. I placed a console.log on the ...
- 67
2
votes
1
answer
1k
views
Display the triangle pointStyle of chartjs upside down
Is it possible to make the pointStyle: 'triangle' of Chart.js upside down?
I've been searching the net for hours trying to find the solution on how to reverse the triangle but there seem to be no ...
1
vote
0
answers
80
views
Angularjs karma giving error when trying to use chart.js
I am using chart.js in my angularjs web app and for karma testing when running karma start, it cannot find chart.js module
0
votes
1
answer
897
views
How to set minimum height for bars graph
I am displaying a graph but when the value is less the graphs are not shown I want a minimum height so they can be displayed.
I am using chartjs to display the graphs.
My html :
<...
- 23
0
votes
1
answer
408
views
Displaying Legend only once when Several pie charts are drawn in the same page using chart.js
I am drawing several pie charts using chart.js in the same page. All pie charts have the same legend. The following code is used to draw the pie-chart with the legend for each pie-chart.
$scope. ...
- 523
3
votes
0
answers
56
views
Can't Scroll Viewport up or down with finger over Chart
I have used ChartJS and AngularJS to make a doughnut and line chart on my mobile app . The problem that I am facing is that I can't scroll up or down the viewport/screen. If I try scrolling from ...
- 147
1
vote
1
answer
568
views
How to make money format in chart js in javascript
Above is my data in a chart bar using javascript, I didn't have any idea how to format the money like: "11,372,626" in the labels.
This below is how to show the data in the chart bar.
$scope....
- 183
0
votes
1
answer
36
views
How to load a chart in a diferent page
I have a chart that is being constructed on page x but I want to load that chart in page y. How do I do that?
I'm trying to use a service but it didn't work.
page x
chart = [];
this.chart = new ...
1
vote
0
answers
221
views
Chartjs - Bar Chart - Backgroud Gradient
i have a angularjs project with chartjs .
I want to have a bar-chart with gradient background.
Searching in google i have found this code
var backgroundGradient = $element.find('canvas')[0]....
- 93
0
votes
1
answer
137
views
Multi dataset line graph from table
I am trying to create a multi set line graph using chart js and angular. Using map I can reduce the json data to single Dimentional array but I need to convert one of column(head) as label with ...
- 15
0
votes
2
answers
5k
views
How to change NaN values to 0 in Chart.js?
I have a Chart in which I'm taking the values with AngularJS.
When there are no Values, Angular throws it as undefined.
And when passing these values to the Chart, the chart don't shows them (Which ...
- 505
0
votes
1
answer
318
views
Can we remove bar chart line on click on pie chart legend label?
I am trying to remove/show the particular 'horizontalBar' line after clicking on legend of pie chart:
On legend call back function i can easily get the index value and text value by the below code
...
- 118
1
vote
1
answer
182
views
chartjs line graph points with different color
I am using chartjs graph for angularjs my concern is the points on line graph i need to give them different colors based on ranges on data . can anyone help how can i do it to change fillcolor ...
0
votes
1
answer
255
views
How to store a chart.js chart options in another file in AngularJS
I have an angularJS app where I need to use a history chart in one of my app controllers. The library I am using is chart.js. Every chart has to have some initial static configuration options and the ...
- 144
0
votes
1
answer
998
views
How to change bar color on a angular-chart and chart js bar graph with multiple datasets?
I am able to set the colors for both datasets(estimated time vs actual time spent), with am array length size 2, that sets all the bars for each set as the designated colors.
I need to change the ...
1
vote
2
answers
62
views
How to write better code in es6 for formatting an object with array values
I wanted to get a better solution using map functions to get the same desired result.
I am formatting an object for chartJs for chart with bar values.
But I am using an old method of es5 syntax, I ...
0
votes
2
answers
2k
views
Multi- Line title in chart.js not working
I have my chat.js title as
new Chart(document.getElementById(z).getContext('2d'), {
type: 'doughnut',
data: {
datasets: [{
...
- 115
1
vote
1
answer
394
views
How to create overlapping bar charts in angular js?
i have trying to create a chart like
this. I have tried with highchart.js and chart.js but result is not like expected. Is there any plugin to create a chart like this? Or any other way to stack ...
- 1,363