chart.js 2.1

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.1.0/Chart.bundle.min.js"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.3/Chart.min.js'></script>
<canvas id="myChart" style="height: 300px"></canvas>

JavaScript

var data = {
  labels: ["1_jan", "2_jan", "3_jan"],
			datasets: [
			  {
            type: 'bar',
            label: 'fees',
            data: [-5,-5,-6],
            backgroundColor: 'yellow',
            borderColor: 'black',
            fill: false,
            pointRadius: 6,
            pointHoverRadius: 6,
            bezierCurve: false,
          },
          {
            type: 'bar',
            label: 'net revenue',
            data: [20,32,20],
            backgroundColor: 'pink',
            borderColor: 'black',
            fill: false,
            pointRadius: 6,
            pointHoverRadius: 6,
            bezierCurve: false,
            order: 1,
          },
          {
            type: 'line',
            label: 'net revenue',
            data: [20,32,20],
            backgroundColor: 'pink',
            borderColor: 'black',
            fill: false,
            pointRadius: 8,
            pointHoverRadius: 8,
            bezierCurve: false,
            order: 2,
          },
          {
            type: 'bar',
            label: 'refunds',
            data: [-1,-5,-6],
            backgroundColor: 'lightblue',
            borderColor: 'black',
            fill: false,
            pointRadius:6,
            pointHoverRadius: 6,
            bezierCurve: false,
          },
          {
            type: 'bar',
            label: 'taxes',
            backgroundColor: 'blue',
            data: [-1,-5,-6],
            borderColor: 'black',
            fill: false,
            pointRadius: 6,
            pointHoverRadius: 6,
            bezierCurve: false,
          },
          
			]
};

var ctx = document.getElementById("myChart").getContext("2d");
new Chart(ctx, {
  type: 'bar',
  data: data,
  options: {
        legend: {
          display: false,
        },
        tooltips: {
          intersect: true,
          mode: 'x',
        },
        responsive: true,
        maintainAspectRatio: false,
        elements: {
          line: {
          ...