score:2

Accepted answer

this can be done with the plugin core api. the api offers different hooks that may be used for executing custom code. in your case, you could use the afterdatasetupdate hook to increase the radius of the points in the dataset's metadata.

plugins:[{
  afterdatasetupdate: chart => {
    chart.getdatasetmeta(0).data.foreach(v => {
      v._model.radius *= 10;
      v._options.hoverradius = v._model.radius;
    })
  }
}],

new chart('canvas', {
  type: 'bubble',
  plugins: [{
    afterdatasetupdate: chart => {
      chart.getdatasetmeta(0).data.foreach(v => {
        v._model.radius *= 10;
        v._options.hoverradius = v._model.radius;
      })
    }
  }],
  data: {
    datasets: [{
      label: 'first dataset',
      data: [
        {x: 10, y: 20, r: 1 }, 
        {x: 20, y: 10, r: 2 }
      ],
      backgroundcolor: 'rgb(255, 99, 132)'
    }]
  },
  options: {
    scales: {
      xaxes: [{
        ticks: {
          min: 5,
          max: 25
        }
      }],
      yaxes: [{
        ticks: {
          min: 5,
          max: 25
        }
      }]
    }
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/chart.js/2.9.3/chart.min.js"></script>
<canvas id="canvas" height="90"></canvas>


Related Query

More Query from same tag