var chart = new BubbleChart({
  canvasId: "bubblechart",
  metric: "Kb",
  usedArea: 0.35,
  contain: true,
  popoverOpts: {
    textFont: "Open Sans",
  },
  data : myCustomData()
});
chart.paint();

{
  canvasId: "",      // id of target <canvas>
  usedArea: 0.5,     // how much of the canvas you wish to use for bubbles
  data: [],          // Array of data objects (converted into bubbles)
  metric: "",        // Label for your data metric (shown in popover)
  attribution: true, // controls "(Powered by BubbleChart)"
  fillColors: [],    // Array of colors to randomly choose from if data
                     // object lacks fillColor

  contain: false,       // keep bubbles within the canvas
  gutter: 0,            // containment gutter
  borderColor: "",      // Global Bubble border color
  borderSize: 0,        // Global Bubble border size
  textColor: "#fff"     // Bubble label color
  textType: "helvetica" // Font

  popoverOpts: {        // Control the look of the hover popover
    textFont: 'helvetica',
    textColor: '#fff',
    fillColor: '#333',
    opacity: 0.6,
  }
}

{
  label: "Name of the thing",
  data: 10,
  metric: "this specific metric",
  borderColor: "#FFF",
  borderSize: 3,
  img_src: 'http://.../someImage.jpg'
}

{
  label: "Name of the thing",
  data: 10,
  img_src: 'http://.../image.jpg'
  img_area: 0.6
}

var chart = new BubbleChart({
  canvasId: "bubblechart",
  metric: "Kb",
  usedArea: 0.35,
  contain: true,
  popoverOpts: {
    textFont: "Open Sans",
  }
});

chart.spinner.start();
chart.data = myCustomData();
chart.reload()
chart.spinner.stop();
chart.paint();