patternfly/tests-src/_includes/widgets/charts/bar-horizontal.html

This reference implementation of PatternFly is based on [Bootstrap v3](http://getbootstrap.com/). Think of PatternFly as a "skinned" version of Bootstrap with additional components and customizations.

<div id="{{include.id}}"></div>
<script>
  var c3ChartDefaults = $().c3ChartDefaults();

  var chartUrls = [
    'https://www.gogole.com',
    'https://www.yahoo.com',
    'https://www.bing.com/',
    'https://duckduckgo.com/'
  ];
  var categories = ['Q1', 'Q2', 'Q3', 'Q4'];
  var columnsData = [
    ['data1', 400, 360, 320, 175]
  ];

  var horizontalBarChartConfig = $().c3ChartDefaults().getDefaultBarConfig(categories);
  horizontalBarChartConfig.bindto = '#{{include.id}}';
  horizontalBarChartConfig.axis = {
    rotated: true,
    x: {
      categories: categories,
      type: 'category'
    }
  };
  horizontalBarChartConfig.data = {
    type: 'bar',
    columns: columnsData,
    // optional drilldown behavior
    onclick: function (d, element) {
      window.location = chartUrls[d.index];
    }
  };
  var horizontalBarChart = c3.generate(horizontalBarChartConfig);
</script>