[Chartjs]-Chart.js : Is there a way to name each bubble in chart?

by

1👍

✅

In your data declaration, you can add custom properties if you need to :

data: [{
    x: 20,
    y: 30,
    r: 15,
    symbol: "£",
    bond_type: "corporate"
}, {
    x: 40,
    y: 10,
    r: 10,
    symbol: "$",
    bond_type: "james"
} /* ... */]

Since this data is dynamic, you need to do it from your back-end of course.

Afterwards, you can access these new properties in your callback (onClick event for instance) :

options: {
    onClick: function(e) {
        var element = this.getElementAtEvent(e);

        if (element.length > 0) {

            var data = this.config.data.datasets[element[0]._datasetIndex].data[element[0]._index];

            console.log(data);
            // You can have the following for instance :
            // data -> { x:40, y:10, r:10, symbol:"$", bond_type:"james" }
        }
    }
}

Leave a comment