Tutorial: How to Build a Custom Panel

In this tutorial, we are going to show you how to build a new custom panel in Banana dashboard.

• Copy this template_panel directory to banana/src/app/panels/ and rename it to reflect the functionality of our panel. For example, in this tutorial, we will create a custom panel that draw a bar chart using D3.js, so let's name this panel, bar.

• Inside the bar panel directory, we should see three files:

  1. module.js - this is where we define the panel's controller code.
  2. module.html - this is the view code (visual representation on the dashboard) of the panel.
  3. editor.html -

• Add the new panel name to panel_names array in banana/src/config.js, so that it will show up in the drop-down box in the "Add Panel" interface.