Javascript Criar um gráfico com Google Charts alimentado por JSON

[jsvitor]

Olá,

Estou em trabalhando na parte de front-end e atualmente estou criando um gráfico, mas estou com problemas em entregar dados com o JSON.

 

Esse é o código em JS:

 

function drawChart() {



    const container = document.querySelector('#chart');



    let chart = new google.visualization.ColumnChart(container);



    //Informações data.json



    let dataRequest = new Request("./datas/data.json");



    fetch(dataRequest)

        .then(function(resp) {

            return resp.json();

        })

        .then(function(data) {

            console.log(data);

        });



    // Informações gráficos



    let data = new google.visualization.arrayToDataTable([

        ["Volume", "Valor"],

        ["DA", 67],

        ["CIF", 23],

        ["Expurgo", 45]

    ]);



    const options = {

        titlePosition: 'none',

        colors: ['#ed4a0e', '#15466e'],

        backgroundColor: 'transparent',

        animation: {

            startup: true,

            duration: 1000,

            easing: 'out',

        },

        hAxis: { textStyle: { color: 'white' }, titleTextStyle: { color: 'white', fontSize: 15 } },

        vAxis: { textStyle: { color: 'white' }, titleTextStyle: { color: 'white', fontSize: 15 } },

        chartArea: { width: 250, height: 200 },

        legend: {

            textStyle: { color: '#ffffff', fontSize: 13 }

        }

    };





    chart.draw(data, options)

};

e esse o JSON:

 

[

["Volume", "Valor"],

["DA", 67],

["CIF", 23],

["Expurgo", 45]

]

Nunca mexi com charts e estou em dúvida, agradeço quem puder me ajudar!