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

151
Views
ReactJS Convert json to [name: value:] pair

I have this json object.

[
    {
        "crime": "LARCENY-NON_VEHICLE",
        "count": "23217"
    },
    {
        "crime": "AUTO_THEFT",
        "count": "13675"
    },
    {
        "crime": "LARCENY-FROM_VEHICLE",
        "count": "28627"
    },
    {
        "crime": "BURGLARY-RESIDENCE",
        "count": "16312"
    }
]

I need to display this data in a pie chart so I need to convert it to this format.

[
    {name: "LARCENY-NON_VEHICLE", value: 23217},
    {name: "AUTO_THEFT", value: 13675},
    {name: "LARCENY-FROM_VEHICLE", value: 28627},
    {name: "BURGLARY-RESIDENCE", value: 16312}
    
]

This is how Im retrieving the data using axios.

about 4 years ago · Juan Pablo Isaza
2 answers
Answer question

0

You can just use map to return a new array with values from old array

const data = [{
    "crime": "LARCENY-NON_VEHICLE",
    "count": "23217"
  },
  {
    "crime": "AUTO_THEFT",
    "count": "13675"
  },
  {
    "crime": "LARCENY-FROM_VEHICLE",
    "count": "28627"
  },
  {
    "crime": "BURGLARY-RESIDENCE",
    "count": "16312"
  }
];

const newData = data.map(item => {
  return {
    name: item.crime,
    value: +item.count // + to convert string to number
  }
});

console.log(newData)

about 4 years ago · Juan Pablo Isaza Report

0

You can simply format an array by calling map function

const arr = [
  {
    crime: "LARCENY-NON_VEHICLE",
    count: "23217",
  },
  {
    crime: "AUTO_THEFT",
    count: "13675",
  },
  {
    crime: "LARCENY-FROM_VEHICLE",
    count: "28627",
  },
  {
    crime: "BURGLARY-RESIDENCE",
    count: "16312",
  },
];

arr.map((e) => ({
  name: e.crime,
  count: Number.parseInt(e.count)
}))
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!