var chart2 = bb.generate({
  title: {
    text: "point.sensitivity='radius'",
  },
  data: {
    columns: [
      ["data1", 450, 300, 550, 600, 500],
      ["data2", 420, 340, 550, 400, 250],
    ],
    onclick: (d) => {
      console.log(d);
    },
    type: "bubble", // for ESM specify as: bubble()
  },
  point: {
    sensitivity: "radius",
  },
  axis: {
    x: {
      type: "category",
    },
    y: {
      padding: {
        top: 70,
      },
    },
  },
  bindto: "#pointSensitivity_2",
});

var chart3 = bb.generate({
  title: {
    text: "point.sensitivity=Function",
  },
  data: {
    columns: [
      ["data1", 450, 300, 550, 600, 500],
      ["data2", 420, 340, 480, 400, 250],
    ],
    type: "bubble", // for ESM specify as: bubble()
    onclick: (d) => {
      console.log(d); //never fired
    },
  },
  point: {
    sensitivity: function (d) {
      if (d.id === "data1") {
        return d.r;
      } else {
        return d.value > 400 ? d.r : 10;
      }
    },
  },
  axis: {
    x: {
      type: "category",
    },
    y: {
      padding: {
        top: 70,
      },
    },
  },
  bindto: "#pointSensitivity_3",
});