Custom Chart.js demo chart

chartjs01.js

const originalData = [
  { name: 'Bank 1', balance: -50, currency: 'EUR', date: '2012-12-01', image: 'data:image/gif;base64,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' },
  { name: 'Bank 2', balance: 150, currency: 'EUR', date: '2012-12-13', image: 'data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==' },
  { name: 'Bank 3', balance: 25, currency: 'EUR', date: '2013-02-01', image: 'data:image/jpeg;base64,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y8K5Rmvj1TY0dIeg2reyy+nynU3+7uRJYl0eYsnxz8eXE0SxGH7yKXdIeg1Leuy+7yhU1+9sa7J6TsJR/VtPvsl4WSjBfDrCOJdLiLEs/HjzNE8Z4s/U8PTaHdmZNdMFvzk+3buS7W/JFYZ3SFrOT1o47qxY78nXDrS28G5br7kiMZGVkZVztyb7LrHyc7JuT+9kurTLH52PYgX6zXHyqW7+/BNtf6QrL4zxdHg6q3yeRNe0/wDCu73vnz7mQac522SsslKc5NuUpPdtvvbOILenHrpW0EUeRk25Et5sAA7kYAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA//ZICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICA=' }
]

const data = {
  labels: originalData.map(acc => acc.name),
  datasets: [
    {
      data: originalData.map(acc => acc.balance),
      backgroundColor: originalData.map(acc => acc.balance < 0 ? 'red' : 'blue'),
      images: originalData.map(acc => acc.image),
      dates: originalData.map(acc => acc.date)
    }
  ]
}

const images = originalData.map(acc => {
  const img = new Image();
  img.src = acc.image;
  return img;
});

const logoWidth = 50, logoHeight = 50;

const options = {
  maintainAspectRatio: false,
  legend: { display: false },
  layout: {
    padding: { top: logoHeight }
  },
  onResize: function(chartInstance) {
    console.log(chartInstance)
  },
  scales: {
    xAxes: [{ display: false }],
    yAxes: [{
      paddingTop: 50,
      gridLines: {
        color: 'transparent',
        zeroLineColor: '#ccc'
      },
      ticks: { display: false }
    }]
  },
  hover: { animationDuration: 0 },
  animation: {
    duration: 0,
    onComplete: drawLabels
  },
  tooltips: {
    displayColors: false,
    backgroundColor: '#eee',
    titleFontColor: 'black',
    titleFontStyle: 'normal',
    bodyFontColor: 'black',
    bodyFontStyle: 'bold',
    footerFontColor: 'black',
    footerFontStyle: 'normal',
    callbacks: {
      title: function(tooltipItem, data) {
        const item = tooltipItem[0];
        const dataset = data.datasets[item.datasetIndex]
        const index = item.index;
        const date = dataset.dates[index];
        return `${item.xLabel} - ${date}`;
      },
      label: function(tooltipItem, data) {
        return 'customLabel';
      },
      footer: function(tooltipItem, data) {
        return 'and Footer';
      }
    }
  }
}


function drawLabels(chartInstance, animationObject) {
  const ctx = this.chart.ctx;
  this.data.datasets.forEach(dataset => {
    for (let i = 0; i < dataset.data.length; i++) {      
      const model = dataset._meta[Object.keys(dataset._meta)[0]].data[i]._model;     
      const img = new Image();
      const y = (model.base < model.y ? model.base : model.y) - logoHeight - 10;
      img.src = dataset.images[i];
      img.onload = () => ctx.drawImage(img, model.x - logoWidth / 2, y, logoWidth, logoHeight);
    }
  });
}


const myChart = new Chart('chart', {
  type: 'bar',
  data: data,
  options: options
});

chartjs02.html

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>Chart.js v2 demon</title>
  <link rel="stylesheet" href="chartjs03.css">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.bundle.min.js"></script>
  <script src="chartjs01.js"></script>
</head>
<body>
<div class="wrapper">
  <canvas id="chart"></canvas>
</div>
</body>
</html>

chartjs03.css

.wrapper {
  width: 400px;
  height: 400px;
  margin: 0 auto;
  border: 1px solid black;
}