How to pass an array value that uses a formula to Chart.js

Tags: #<Tag:0x00007f8b1aff91f8>

If a hard coded variable is passed to Chart.js everything works fine.
For example if mydata[0][0] = 45000 , passing mydata[0][0] works.

Trying to pass a numeric value from a formula doesn’t give the same result. For example:
If mydata [0][0] value uses a formula, such as ‘=b1’ then nothing seems to be passed.

Is there a method to do this ?

<canvas id="myChart" width="100" height="50"></canvas>
<div class="HeadingTable center" id="excel"></div>

<script>
    var mydata = [
        ['=b1', 45000],
        [0,45000]
    ];
    document.addEventListener("DOMContentLoaded", function () {
        var container = document.getElementById('excel');
        var hot = new Handsontable(container, {
            data: mydata,
            rowHeaders: true,
            colHeaders: true,
            filters: true,
            dropdownMenu: true,
            formulas: true,
            licenseKey: "non-commercial-and-evaluation",
        })
        var ctx = document.getElementById('myChart').getContext('2d');
        var myChart = new Chart(ctx, {
            type: 'bar',
            data: {
                labels:  ['With Formula','Hard Coded'],
                datasets: [{
                    label: 'Formula Test',
                    data: [mydata[0][0], mydata[0][1]],
                    backgroundColor: [
                        'rgba(255, 99, 132, 0.2)',
                        'rgba(54, 162, 235, 0.2)',
                    ],
                    borderColor: [
                        'rgba(255, 99, 132, 1)',
                        'rgba(54, 162, 235, 1)',
                    ],
                    borderWidth: 1
                }]
            },
            options: {
                scales: {
                    yAxes: [{
                        ticks: {
                            beginAtZero: true
                        }
                    }]
                }
            }
    });
});

Hi,

To get the calculated value you have to use hotInstance.getData() method. Otherwise you’re referring string in Chart.js and it cannot render this as a value on the chart.

Best,
Wojciech

Hi Wojciech,

That worked. Appreciate your help.

Best,
Holding