Can't get callback example working

[songproducer]

I'm able to choose the callback from the admin, but on the webpage it doesn't display.

I'm using this with the Wagtail News Template so the only difference I think is that I'm calling the chart from within the blocks.StreamBlock class

utils/blocks.py

CHART_CONFIG_CALLBACKS = (
        ('barchart_labels', 'Bigger font and bold labels'),
    )
class StoryBlock(blocks.StreamBlock):
        chart = ChartBlock(callbacks=CHART_CONFIG_CALLBACKS)

static_src/javascript/main.js

window.barchart_labels = function() {
    return {
        plugins: {
            datalabels: {
                font: {
                    size: 18,
                    weight: 'bold',
                },
                color: '#ff0000'
            }
        }
    }
}

[saevarom]

Hi @songproducer When you have loaded the page containing this example, can you go to the console and call window.barchart_labels - is the function present in the global scope?

[songproducer]

I think it's present.

function barchart_labels()
​
length: 0
​
name: ""
​
prototype: Object { … }
​
<prototype>: function ()

[saevarom]

OK. And are you overriding the template for the block? If so, you should have the data-callbacks attribute like it's done in https://github.com/overcastsoftware/wagtailcharts/blob/main/wagtailcharts/templates/wagtailcharts/blocks/chart_block.html

Try to view the source on your rendered page and see if you actually have data-callbacks on your canvas element.

[songproducer]

Yes, I have data-callbacks attribute in the template override. I rendered {{self.callbacks}} and it displays: None

[songproducer]

Sorry, I realised I hadn't selected the callback. Now it displays: barchart_labels and the chart doesn't render