Questions tagged [chartjs-2.6.0]

Chart.js is a JavaScript library for creating animated, interactive graphs for inclusion on web pages. This tag is for version 2.6.0 specific questions.

Chart.js 2.6.0

Chart.js is a javascript library that can be used to easily create animated, interactive graphs to include on web pages.

Version 2.6 provides improved stability, a new documention and new features like an advanced area chart.

Further Information

Related tags

291 questions
5
votes
1 answer

Chart.js: How can a line series (out of many) change line color and thickness upon mouse hover?

I've created a Chart.js line plot with multiple lines (1 pixel thickness by default), and I want the user to be able to mouse over any particular line plot (not just the points) and have the plot change its line thickness (i.e. 3 pixels). Is this…
sunw
  • 535
  • 5
  • 29
5
votes
1 answer

Chartjs 2.7.3: Set Y data at the correct X position axis

data: { labels: ['29 Oct, 18', '30 Oct, 18', '02 Nov, 18', '14 Nov, 18', '15 Nov, 18', '19 Nov, 18', '20 Nov, 18', '28 Nov, 18'], datasets: [{ pointRadius: 0, label: 'Positive', …
Sharpless512
  • 3,062
  • 5
  • 35
  • 60
5
votes
3 answers

Print chart using chart js

I am using Chart JS library to create charts https://www.chartjs.org/ Say I have the below code
Using the FileSaver.js I am able to save the chart using the below…
SP1
  • 1,182
  • 3
  • 22
  • 47
5
votes
1 answer

Position Label under the Horizontal Bar

Is it possible to put the Label of the Bar under it in a HorizontalBar layout? Most of the examples I see online usually state putting the bar's label inside the bar, I haven't really seen one that places the label either on top or under the bar. …
RoboKy
  • 141
  • 1
  • 10
5
votes
2 answers

ChartJS: Draw vertical line at data point on chart on mouseover

I can't figure out how I might draw a vertical line on a line chart at a data point when hovering over it using Chart JS. I would like the line to stay within the bounds of the chart rectangle so that it does not extend into the tick area. Any help…
Timothy Barmann
  • 598
  • 7
  • 17
4
votes
1 answer

Render Chartjs on hidden DIV

I'm trying to render many charts using chart.js on a hidden div, then convert them to images to use in a PDF report. My problem is: if the chart is not rendered on the DOM, I can't capture it and draw it on a canvas. Until the chart is shown, it…
Paulo Galdo Sandoval
  • 2,173
  • 6
  • 27
  • 44
4
votes
1 answer

Make y-axis sticky when having horizontal scroll on chartJS and Angular

I would like to fix y-axis position when scrolling horizontally. Here's an example that works but without using Angular $(document).ready(function () { function generateLabels() { var chartLabels = []; for (x = 0; x <…
infodev
  • 4,673
  • 17
  • 65
  • 138
4
votes
1 answer

Find intersection between the chart lines in chartjs

I am trying to create a line chart that presents score level from 1-100. Line is static and needs to be curved but the dot on the chart is dynamic value and by that it changes its location along the existing line. First I was thinking to add…
4
votes
3 answers

react-chartjs-2 vertical line when hovering over chart

I'm trying to create a linechart, using react-chartjs-2, that has a vertical line when hovering over the datapoints in the chart. Like in this picture below: Chart requirements I tried using the chartjs-plugin-annotation plugin, but with mixed…
Grotle
  • 53
  • 1
  • 6
4
votes
1 answer

Chart js: Update line chart having two data sets

I want to update a line chart in chart js with two data sets. I've somehow managed to empty the chart and then able to fill in one of the data set. but unable to make both data sets working. here's the code. ajaxRequest( { url:…
rakesh shrestha
  • 1,335
  • 19
  • 37
4
votes
3 answers

Show Data labels on the Bar in Chart.js

I have a very special question concerning the horizontal Bar Chart. Is it possible to show the dataLabels ON the Bar itself? Like in this picture: Drawing of the charts I tried to do it with this: ticks: { padding: -xx, } But unfortunately the…
Enick
  • 81
  • 1
  • 1
  • 5
4
votes
1 answer

How to update data Chart in async way in Angular Chart.js?

I've project based on ngx-admin starter empty (without all libraries). I imported angular2-chartjs lib in package.json. The Chart is drawn correctly. I need to update data of chart when I receive response from server, in async way. I read the…
sawyer
  • 325
  • 1
  • 3
  • 13
4
votes
1 answer

Rotate 90 degrees clockwise the scaleLabel (no ticks or labels) on a Chart.js line chart

How can I rotate 90 degrees clockwise the display of scaleLabel on the yAxis? Not the ticks or labels but the single element which is usually on the left side of the yAxis. In this example, containing the string: labelString:'My Label' var options…
3
votes
2 answers

ng2-chart: How to show percentage values inside the chart?

I've been googling for hours but didn't find the answer for this yet. I'm using ng2-chart to generate charts in my dashboard. It's working well, the problem is that I want to show the percentage values inside the doughnut chart but I don't know how…
Andre
  • 431
  • 7
  • 23
3
votes
0 answers

Show full date on start of new day with chart.js

In chart.js, is it possible to display the full date (e.g 24.04.2020) when the time scale is set to hours. This should only happen at midnight. So for example you have the hours in the image and at "00" (midnight) there should be a label with…
ComanderKai77
  • 460
  • 6
  • 14
1
2
3
19 20