Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

130
Views
React Chartjs is not showing any output

React

As you can see JSX code for Bar Chart, suppose to show a bar chart with data values. But it doesn't show any output or error as well

JSX

import React from 'react'
import { Bar } from 'react-chartjs-2';

    export default function BarChart() {
            var data = {
                labels: ["Home", "Product", "Cart"],
                datasets: [
                    {
                        label: ' ',
                        data: [38, 75, 25],
                        borderColor: ['rgb(82,134,163)'],
                        backgroundColor: ['rgb(82,134,163)'],
                        pointBackgroundColor: 'rgb(82,134,163)',
                        pointBorderColor: 'rgb(82,134,163)'
                    }
                ]
            }
            return (
                <div>
                    <Bar
                        Data={data}
                        height={400}
                        width={600}
                        options={{
                            maintainAspectRatio: false
                        }}
                    />
        
                </div>
            )
        }
about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

The prop for passing the data to the Bar component should be data instead of Data:

<Bar
  data={data}
  height={400}
  width={600}
  options={{
    maintainAspectRatio: false
  }}
/>

As a result, the component was behaving as it was not receiving any data.

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!