.chart-container{
  position:relative;
  width:100%;
}

(function () {
  // Chart.js Config
  const config = {
    type: "bar",
    data: {},
    options: {
      indexAxis: "y",
      maintainAspectRatio: false,
      plugins: {
        title: {
          display: true,
          font:{
            size:16
          },
          text: ""
        }
      },
      scales:{
        xAxis:{}
      }
    }
  };
  const data = {
    labels: [],
    datasets: [
      {
        axis: "y",
        data: [],
        fill: false,
        backgroundColor: [
          "rgba(255, 99, 132, 0.2)",
          "rgba(255, 159, 64, 0.2)",
          "rgba(255, 205, 86, 0.2)",
          "rgba(75, 192, 192, 0.2)",
          "rgba(54, 162, 235, 0.2)",
          "rgba(153, 102, 255, 0.2)",
          "rgba(201, 203, 207, 0.2)"
        ],
        borderColor: [
          "rgba(255, 99, 132, 0.2)",
          "rgba(255, 159, 64, 0.2)",
          "rgba(255, 205, 86, 0.2)",
          "rgba(75, 192, 192, 0.2)",
          "rgba(54, 162, 235, 0.2)",
          "rgba(153, 102, 255, 0.2)",
          "rgba(201, 203, 207, 0.2)"
        ],
        borderWidth: 1
      }
    ]
  };

  // build Charts
  var charts = document.getElementsByClassName("chart-space");
  for (var i = 0, max = charts.length; i < max; i += 1) {
    var chartEl = charts[i];
    var raw = JSON.parse(chartEl.dataset.values);
    var parent = chartEl.parentElement;
    var title = chartEl.dataset.title;
    var valueCaption = chartEl.dataset.valueCaption;
    var barHeightEm =
      typeof chartEl.dataset.barHeight === "undefined"
        ? 4
        : parseInt(chartEl.dataset.barHeight, 10);
    var __labels = [];
    var __data = [];

    var count = 0;
    for (key in raw) {
      __labels.push(key);
      __data.push(raw[key]);
      count++;
    }

    var _config = JSON.parse(JSON.stringify(config));
    var _data = JSON.parse(JSON.stringify(data));

    parent.style.height = barHeightEm * count + "em";

    _data.labels = __labels;
    _data.datasets[0].data = __data;
    _data.datasets[0].label = valueCaption;
    _config.data = _data;
    _config.options.plugins.title.text = title;
     if(typeof chartEl.dataset.min !== "undefined"){
     _config.options.scales.xAxis['min'] = parseInt(chartEl.dataset.min, 10);
   }
    if(typeof chartEl.dataset.max !== "undefined"){
     _config.options.scales.xAxis['max']= parseInt(chartEl.dataset.max, 10);
   }
    const myChart = new Chart(chartEl, _config);
  }
})();