0

Quiero leer una json de una url local para que se visualice con chartjs pero el recorrido del data.map me tira que no es una funcion. Quiero Hacer la peticion por medio de un fetch utilizando map para recorrer el json pero no se si estoy usando bien su estructura.

const url = "http://localhost:3000/temperatura";
const ctx = document.getElementById('myChart').getContext('2d');

const response =  fetch(url)
    .then(res => res.json())
    .then(data=>{
        const mes = data.map(e=>e.mes);
        const valor = data.map(e=>e.valor_temp);
    console.log(data)


    const myChart = new Chart(ctx, {
        type: 'bar',
        data: {
            labels: mes,
            datasets: [{
                label: 'Temperatura',
                data: valor,
                backgroundColor: [
                    'rgba(255, 99, 132, 0.2)',
                    'rgba(54, 162, 235, 0.2)',
                    'rgba(255, 206, 86, 0.2)',
                    'rgba(75, 192, 192, 0.2)',
                    'rgba(153, 102, 255, 0.2)',
                    'rgba(255, 159, 64, 0.2)'
                ],
                borderColor: [
                    'rgba(255, 99, 132, 1)',
                    'rgba(54, 162, 235, 1)',
                    'rgba(255, 206, 86, 1)',
                    'rgba(75, 192, 192, 1)',
                    'rgba(153, 102, 255, 1)',
                    'rgba(255, 159, 64, 1)'
                ],
                borderWidth: 1
            }]
        },
        options: {
            scales: {
                y: {
                    beginAtZero: true
                }
            }
        }
    });
});

Este es el json q quiero leer, está alojado en mongodb atlas

{"error":"","body":[{"_id":"6328a8748479b531f4e5b578","mes":"Junio","valor_temp":75,"__v":0},{"_id":"6328a8928479b531f4e5b57c","mes":"Mayo","valor_temp":32,"__v":0},{"_id":"6328a89a8479b531f4e5b57e","mes":"Julio","valor_temp":25,"__v":0},{"_id":"6328a8a18479b531f4e5b580","mes":"Agosto","valor_temp":30,"__v":0},{"_id":"6328a8b48479b531f4e5b583","mes":"Septiembre","valor_temp":20,"__v":0}]}

1 respuesta 1

0

Lo que pasa es que map es una función para los array y tú tienes un objeto, que dentro tiene un array. Entonces debes hacer un map al data.body

Tienes que poner:

const mes = data.body.map(e=>e.mes);
const valor = data.body.map(e=>e.valor_temp);
1
  • muchas gracias, ya pude obtener los datos!
    – akaligod
    Commented el 19 sept. 2022 a las 23:43

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.