Dynamically add multiple charts based on a JSON

[littlesuzi]

I have a JSON that has three datasets which I'd like to visualize as a doughnut chart.
Is there a way for me to have only one function that generates a doughnut chart using the dataset at position n? Or how can I write this dynamically?

Right now, I'm getting the error "Canvas is already in use. Chart with ID '" + o.id + "' must be destroyed before the canvas with ID '" + o.canvas.id + "' can be reused."

This is the function I have right now (the element includes the data set and the id is just the id of the element in JSON that is passed).

`function generateDChart(element, id){

        var options = element.options;
        var optionsCount = options.length;
        var colors = generateRandomPastelColors(optionsCount);
        var repliesCount = countOptionsByRepliesSecond(element);

        new Chart(document.getElementById(id),{
            type: 'doughnut',
            data: {
                labels: options,
                datasets: [{
                    label: false,
                    data: repliesCount,
                    backgroundColor: colors,
                    hoverOffset: 4
                }]
            },
            options: {
                legend: {
                    position: 'bottom'
                }
            }
        });    
    }`

const chartContent = document.createElement("canvas"); chartContent.id = id;

[ronildo]

On this line it seems the id is the same for all the charts you have. ::new Chart(document.getElementById(id),{::
The id here is the canvas element being used to draw the chart, you will need on canvas per chart.