Zoom Function For Chart.js

Question

I have a chart that I want to use the github zoom feature for found here.

I am have wrote the code below which runs error free, but when I try to zoom in and out on my mouse wheel it does not work.

What code needs to be changed so I can zoom in and out using the mouse wheel?

See the below snippet

EDIT
As suggested in the comments I added a plugin category and the code now reads like the below - but still zoom function is not working.

   <script type="text/javascript">
   var ctx = document.getElementById('doughnut-chart').getContext('2d');

   new Chart(ctx, {
    type: 'doughnut',
    data: {
      labels: ["Day One", "Day Two", "Day Three", "Day Four", "Day Five"],
      datasets: [
        {
          label: "Test",
          backgroundColor: ["#3e95cd", "#8e5ea2","#3cba9f","#e8c3b9","#c45850", "#6bcd3e"],
          data:  ["100", "200", "300", "400", "500" ] , 
        }
      ]
    },
    options: {
      title: {
        display: true,
        text: "Test"
      },
      plugins: {
            zoom: {
                pan: {
                    enabled: true,
                    mode: 'x',
                    speed: 10,
                    threshold: 10
                },
                zoom: {
                    enabled: true,
                    mode: 'y'
                }
             }
          }
       }
    });
  </script>

Answer 1

Please see this plugin and its example.

By default, you can draw a view box or use the mouse wheel to zoom in or out. Double click to fit the chart in the canvas.