@domoinc/multi-metric-comparison-bar-chart/bower_components/ComparisonBarChart/src/DomoWidget.js

MultiMetricComparisonBarChart - Domo Widget

// Add your chart to our the registry with your chart's unique name.
AutoWidgets.register('DomoComparisonBarChartDomo', function(container) {

  // Use the bBox of the 'chartBounds' rect to find out
  // the size of the chart we need to render.
  var bBox = container.select('[id^=chartBounds]')
    .node()
    .getBBox();

  // Transform our chart's container to fit where the user placed the wiget
  container.attr('transform', 'translate(' + bBox.x + ',' + bBox.y + ')')
    .selectAll('*')
    .remove();

  // Set some sample data to use with out widget.
  var sampleData = [
    ['@BobBarker', 600],
    ['@AdamSandler', 1000]
  ];

  // Set the data subscription name to what user specified.
  var dataName = container.node().parentNode.id;

  // This will allow the wiring experience to show the user
  // which widget item they are powering.
  d3.select(container.node().parentNode).attr('data-dm-field', dataName + '_Data');


  // Create the data subscription with sample data.
  // You can create as many of these as your chart needs.
  var sampleDataObj = {};
  sampleDataObj[dataName + '_Data'] = {
    defaultValue: sampleData,
    columnNames: ['Label', 'Value'],
  };

  //Initialize widget and set parameters.
  var widget = AutoWidgets.baseWidget(container.chart('ComparisonBarChart'))
    .c('height', bBox.height)
    .c('width', bBox.width)
    .sampleData(sampleDataObj);

  // Used for sample data check.
  widget._sampleData = sampleData;

  // widget._notifier.showMessage(true);

  widget.renderWithData = function(data) {
    var renderData = data[widget.dataName() + '_Data'].data;
    widget.draw(renderData);
    return widget;
  };

  // Pass the dataname to widget object so it knows which data to call
  // on render.
  widget.dataName(dataName);

  // Return wiget so to keep the methods chainable.
  return widget;
});