charts

$(document).ready(function() {
    var ctx = $("#myChart");

    var bubble = new Chart(ctx,
      {"type":"bubble",
      "data":{
        "datasets":[
          {"label":"Terremoti magnitudo < 5",
          "data":[{"x":32,"y":53,"r":15, name: "Venezia"}],
          "backgroundColor":"rgb(255, 0, 0, 0.3)",
          "borderColor":"red",
          "borderWidth": 1}]
        },
        options: {
            animation:false,
            scales: {
                yAxes: [{ //xAxes
                    ticks: {
                        beginAtZero:true,
                        suggestedMax: 80
                    }
                }],
                xAxes: [{ //xAxes
                    ticks: {
                        beginAtZero:true,
                        suggestedMax: 80
                    }
                }]
            }
        }

      });

    var data = [{"x":50,"y":26,"r":5}, {"x":46,"y":35,"r":10}, {"x":34,"y":39,"r":15}, {"x":16,"y":41,"r":15}]


    function addData(chart, label, data) {

     for (i = 0; i<data.length;i++){


      let d = data[i]
      let ii = i;
      setTimeout(function(){


        chart.data.labels.push(label);
        chart.data.datasets.forEach((dataset) => {
            dataset.data.push(d);});
        chart.update();
      }, (i+1)*2000);
      chart.update();

      }
    }
    addData(bubble, "prova", data)


});