Este es el código:

 import React from 'react'; import {connect} from 'react-redux'; import {vote} from '../store/actions'; import BarChart from "../services/BarChart"; import {color} from '../services/color' const Poll = ({poll, vote}) => { const answers = poll.candidates && poll.candidates.map(candidate => ( <button onClick={() => vote(poll._id, {answer: candidate.candidate})} key={candidate._id}> {candidate.candidate} </button> )); const data = { labels: poll.candidates.map(candidate => candidate.candidate), datasets: [ { label: poll.position, backgroundColor: poll.candidates.map(candidate => color()), borderColor: '#323643', data: poll.candidates.map(candidate => candidate.votes) } ] } return <div> <h3>{poll.position}</h3> <div>{answers}</div> <BarChart chartData={data} /> </div> }; export default connect(store => ({ poll: store.currentPoll }),{vote},)(Poll);

Estoy tratando de graficar un gráfico usando el mapeo de datos. No sé cuál debería ser la sintaxis correcta aquí. Enlace de error de imagen a continuación.

Error:

Error del navegador Error de la consola