Template:Chart bar

 <canvas id=""></canvas>

<script> // defer script execution until the mediawiki loader and jQuery are available RLQ.push([[], function () {

 mw.loader.using('ext.iswiki.chartjs').then(function(){
   const ctx = document.getElementById();

   function makeItemsArray(itemString) {
     let itemsArray = itemString.split(","); 
     for (var i = 0; i< itemsArray.length; i++) {
       itemsArray[i] = itemsArray[i].trim();
     }
     return itemsArray;
   }

   let labels = makeItemsArray();
   let dataIdentifier = ;
   let colors = makeItemsArray(); 
   let dataSeries = makeItemsArray();
   let title = ;
   let legend = ;
   let orientation = ;

   dataIdentifier = dataIdentifier.trim();
   title = title.trim();

   if (legend === 'no') {
       legend = false;
   } else {
       legend = true;
   }

   if (orientation === 'horizontal') {
       indexAxis = 'y';
   } else {
       indexAxis = 'x';
   }

   function drawPieChart(ctx, labels, dataIdentifier, colors, dataSeries, indexAxis, legend, title) {
     //console.log('ctx: ' + ctx);
     //console.log('labels: ' + labels);
     //console.log('dataIdentifier: ' + dataIdentifier);
     //console.log('colors: ' + colors);
     //console.log('dataSeries: ' + dataSeries);
     //console.log('indexAxis: ' + indexAxis);
     console.log('legend: ' + legend);
     //console.log('title: ' + title);
 
     new Chart(ctx, {
       type: 'bar',
       data: {
         labels: labels,
         datasets: [{
           label: dataIdentifier,
           backgroundColor: colors,
           data: dataSeries
         }]
       },
       options: {
         //maintainAspectRatio: false,
         //responsive: true,
         indexAxis: indexAxis,
         title: {
           display: true,
           text: title
         },
         plugins: {
           legend: { display: false },
         }  
       }
     });
   }

   window.drawPieChart = drawPieChart(ctx, labels, dataIdentifier, colors, dataSeries, indexAxis, legend, title);

 });

}]); </script>