Questions tagged [react-chartjs-2]
452 questions
0
votes
1 answer
Resizable/Expendable box annotation in ChartJs
I am using chartjs-plugin-annotation in chartJs with ReactJs. But in box annotation is there a way how can I resize the box so I can expend the min, max value of the annotation.
My option code: `
options: {
scales: {
y: {
…

ppegu
- 362
- 2
- 9
- 22
0
votes
1 answer
hide xAxes labels from Bar chart with 'react-chartjs-2'
I have built a graph of bar chart with some data.
the current result I have is:
and what I want is to delete the names below the xAxes in the bar chart.
I viewed the react-chartjs-2 documentation and tried to change the options, also viewed…

Guy Cohen
- 194
- 1
- 9
0
votes
1 answer
Title is undefined in react-chart
I am building a covid-19 tracker, but when data is displayed on the graph using react charts title is coming out to be undefined
This is my chart code
{data?.length > 0 && (

Makarand
- 477
- 1
- 7
- 17
0
votes
1 answer
Using large values for y axis in Chart.js
I am trying to make a graph with data on a public company's market cap over time. The numbers are in 12figures. So it seems that when using those numbers the chart.js can't draw a graph. My browser just crashes. I tried dividing the number to be…
0
votes
1 answer
Always Enable Tooltip : Chart JS : V3 : Bubble Chart : react-chartjs-2
I am trying to always enable all the tooltips for Bubble chart using react-charjs-2 plugin
I tried various approaches but none of them work with the latest version of the plugin
Would appreciate some advice, Thank you! :)
I tried the all possible…
0
votes
1 answer
Show the values of each arc on doughtnut chart of chart.js
This is my current doughnut chart and I want to show the values of each arc on the arc itself.
This is the configurations of the chart.
const genderConfig={
plugins: {
title: {
display: true,
text: "GENDER",
font: {
…

Albert
- 19
- 4
0
votes
1 answer
【React chart.js】How to add multiple data to Radar chart using map function
I'm trying to figure out how to put multiple data to a radar chart using map function.
I picked some related codes as down below.
class TopPage_Comp extends Component{
constructor(props){
super(props)
this.state = {
…

takataka
- 11
- 4
0
votes
1 answer
In a Stacked Line Chart, is there a way to stack multiple Y-Axes to match each graphed line?
Example of Stacked Y-Axes
I can't figure out a way in Chart.js to get the Y-Axes to stack like I have in the example picture.
When I keep the scales object simple like this:
scales: {
y: {
stacked: true,
title: {
display: true,
…

Bagoette
- 33
- 1
- 3
0
votes
0 answers
Is it possible to hide the hover value displayed on chart in react-chart-js2
I have implemented a pie chart using react-chartjs-2 library. I am facing issue in showing/hiding the tooltip that comes when we hover on the chart.
import React, { PropTypes } from 'react';
import {Pie} from 'react-chartjs-2';
class PieChart…
user11415630
0
votes
2 answers
react-chartjs-2 options prop not working as expected
I am using react-chartjs-2 to build a line chart and none of the options that I have specified in the options prop tend to work.
Here is my code:
import React, { useState, useEffect } from "react";
// import Chart from "chart.js";
import { Line }…

pranshu verma
- 141
- 3
- 15
0
votes
1 answer
React Chartjs 2 display axes above datasets backgroundColor
I have a Line Chart with chart.js and one of the lines has to fill the background delimited with another line. It works well, but how can I do it to see chart axes when the background is filled ??
Here is an example of what I currently have:…

PauCasademont
- 279
- 4
- 18
0
votes
1 answer
in line chart, line is going beyond height when I remove y axis
I am using react-chartjs-2 version 2.7.6. In line chart, if I keep y axis graph line is in limit.
I want to remove y axis but when I remove y axis graph line goes above starting point.

Gaurav Agam
- 32
- 6
0
votes
2 answers
Why are some react-chartjs-2 options being ignored?
I have this simple line chart that I am trying to change the gridlines from their default gray, however the options object appears to be selectively working. Maybe I am missing something basic but I have been fiddling with it for hours and cannot…

Jacob
- 346
- 3
- 13
0
votes
1 answer
CenterText in doughnut in react
centerText: {
display: true,
text: `${income}`,
fontSize : 10
}
I'm not able to see center text using about code in option of doughnut chart.
Anyone know why?
Thank you in advance

user15367939
- 23
- 7
0
votes
0 answers
How hooks (plugins) and different phases in chart.js works?
I read the documentation for chart.js plugins & about different phases like render,init,update available here that occurs while chart appears on browser.
But yet it is not clear for me how these different phases & hooks works.
And which hook to use…

Shardul Pathak
- 55
- 1
- 6