JSFiddle - React, Tailwind, and code Playground

by yash009

JavaScript

// We're building an online poll where users can vote for their favorite food,
// color, etc. We want to display the results as a horizontal bar chart, where
// the widest bar is always the full width of the container. Example:

// POLL RESULTS:
//                   +------------------------------+
//  apples: 20 votes |###############               |
// oranges: 20 votes |###############               |
// bananas: 40 votes |##############################|
//                   +------------------------------+

// Example input
const tallies = [
  { label: "apples", voteCount: 110 },
  { label: "oranges", voteCount: 30 },
  { label: "bananas", voteCount: 40 },
];
const width = 1000;
const widthArray = getWidths(tallies, width);
console.log(widthArray);
// [500, 500, 1000]

function getWidths(tallies, width) {
  // Implement this function
  // let newArray = arr.map(callback(currentValue[, index[, array]]) {
  
  
  
  var arr = tallies.map(i=> i.votecount);
  console.log(arr);
  var maximumVotes = Math.max(...arr);
  var highestVoteCount = maximumVotes;
  var unit = width/maximumVotes;
  var resultArr = arr.map(i=>calcWidth);
  console.log(resultArr);
  return resultArr;
function calcWidth(votes,unit) {
  return votes * unit;
}  
}