I have a bar chart that’s created using chart.js. Everything works fine on page load, but when I change the time frame using a daterangepicker, a glitch appears. The new data is brought in, but when I hover over it, the old data is shown. I’m new to javascript so I’m hoping to get some help. It looks like I
Tag: chart.js
chart.js Failed to create chart: can’t acquire context from the given item
I never got into node so I am pretty sure I am doing something massively wrong here since I cannot find any info at all by googling. I have a django site and I wanted a JS charting library, I chose chart.js. I installed and like the docs, but after that I am unsure of what to do so I
Using Charts.js with react
I am using React and want to tie it in with Chart.js. The graph below works, but I am not sure how to make a Graph component in React. My Chart.js code looks like the following: I then tried to incorporate this into React. Unfortunately, this didn’t work. My code attempt can be seen here.This is kind of working, but
Chartjs – show elements in all datasets on hover using bar chart
Is there a way to show the elements together when hovering on the same x-axis of a bar chart? Same with the image below. I tried hover.mode (‘single’, ‘label’ and ‘x-axis’) Unfortunately it did not work for some reason. Is this not possible or did I miss something? Code here: https://jsfiddle.net/jk4bg8a2/ Thanks. Answer The property is actually stored in tooltips
Chart.js – draw horizontal line in Bar Chart (type bar)
Good evening , I want to draw a horizontal line on a graph Bar Chart using Chart.js . I read the question Chart.js – draw horizontal line and I could not draw the line on a Bar Chart, as indicated is the implementation for Line Chart. My code is implemented to jsfiddle HTML JS and it would be able to
Chart area background color chartjs
I have problem with chart js, i want to coloring chart area like image above I try to find configuration from charJs Docs , but nothing matched. its possible or not to change chart area background color? if possible anyone can help me? Html Javascript Here’s my current code jsFiddle so everyone can try for find solution. thanks for your
How to change color of hidden legend item instead of strike-through in Chart.js
I was looking at this code and added ctx.fillStyle = ‘red’, and got this. I click on eBooks to hide its data but instead of eBooks being red, Microforms and Audiovisuals Mats were changed to red. Answer If you take a look at the fillStyle doc on MDN : The CanvasRenderingContext2D.fillStyle property of the Canvas 2D API specifies the color
chart js 2 how to set bar width
I’m using Chart js version: 2.1.4 and I’m not able to limit the bar width. I found two options on stackoverflow or but neither of one works with the mentioned version. Is there a way to solve this issue without manually modifying the chart.js core library? thanks Answer You were right : The attribute you have to edit is barPercentage.
Skip decimal points on y-axis in chartJS
I am using this library to draw charts in my web app. The issue is that I am having decimal points in my y-axis. You can see that in the image below Is there a way that I can restrict it to only have numbers? This is my code Answer Update: please see an updated answer from @DreamTeK that shows
How can I evenly distribute ticks when using maxTicksLimit?
I made a line chart using Chart.js version 2.1.3. The output is as follow: As you can see, I limited the maximum count of ticks to 8 via maxTicksLimit. However, the distribution is not even. How can I make the ticks distribute evenly? p.s. there are always 289 records in the dataset, and the data is recorded every 5 minutes.