I managed to resolve my issues by referring to the following helpful posts:

Save inline SVG as JPEG/PNG/SVG

https://gist.github.com/gustavohenke/9073132

Here is the complete solution that worked for me:

My Angular directive:

'use strict';

/**
 * @ngdoc: function
 * @name: portalDashboardApp.directive:ogWordCloud
 * @description: Word Cloud Generator based on the d3 word cloud generator done by Jason Davies and a simplified script by Julien Renaux
 * Directive of the portalDashboardApp
 */

angular.module('portalDashboardApp')
  .directive('ogWordCloud', function () {
      return {
          restrict: 'E',
          replace: true,
          templateUrl: './socialMedia.module/socialMedia.templates/WordCloudTemplate.html',
          scope: {
              words: '='
          },
          link: function (scope) {

              var fill = d3.scale.category20b();

              var w = window.innerWidth - 238,
                h = 400;

              var max,
                fontSize;

              var layout = d3.layout.cloud()
                .timeInterval(Infinity)
                .size([w, h])
                .fontSize(function (d) {
                    return fontSize(+d.value);
                })
                .text(function (d) {
                    return d.key;
                })
                .on("end", draw);

              var svg = d3.select("#wordCloudVisualisation").append("svg")
                .attr("width", w)
                .attr("height", h)
                .attr("xmlns", 'http://www.w3.org/2000/svg')
                .attr("xmlns:xlink", 'http://www.w3.org/1999/xlink')
                .attr("version", '1.1')
                .attr("id", "wordCloudSVG");

              var wordCloudVisualisation = svg.append("g").attr("transform", "translate(" + [w >> 1, h >> 1] + ")");

              update();

              window.onresize = function (event) {
                  update();
              };

              var tags = [];

              scope.$watch('words', function () {
                  tags = scope.words;
              }, true);

              function draw(data, bounds) {
                  var w = window.innerWidth - 238,
                    h = 400;

                  svg.attr("width", w).attr("height", h);

                  var scale = bounds ? Math.min(
                    w / Math.abs(bounds[1].x - w / 2),
                    w / Math.abs(bounds[0].x - w / 2),
                    h / Math.abs(bounds[1].y - h / 2),
                    h / Math.abs(bounds[0].y - h / 2)) / 2 : 1;

                  var text = wordCloudVisualisation.selectAll("text")
                    .data(data, function (d) {
                        return d.text.toLowerCase();
                    });
                  text.transition()
                    .duration(1000)
                    .attr("transform", function (d) {
                        return "translate(" + [d.x, d.y] + ")rotate(" + d.rotate + ")";
                    })
                    .style("font-size", function (d) {
                        return d.size + "px";
                    });
                  text.enter().append("text")
                    .attr("text-anchor", "middle")
                    .attr("transform", function (d) {
                        return "translate(" + [d.x, d.y] + ")rotate(" + d.rotate + ")";
                    })
                    .style("font-size", function (d) {
                        return d.size + "px";
                    })
                    .style("opacity", 1e-6)
                    .transition()
                    .duration(1000)
                    .style("opacity", 1);
                  text.style("font-family", function (d) {
                      return d.font;
                  })
                    .style("fill", function (d) {
                        return fill(d.text.toLowerCase());
                    })
                    .text(function (d) {
                        return d.text;
                    });

                  wordCloudVisualisation.transition().attr("transform", "translate(" + [w >> 1, h >> 1] + ")scale(" + scale + ")");
              }

              function update() {
                  layout.font('impact').spiral('archimedean');
                  fontSize = d3.scale['sqrt']().range([10, 100]);
                  if (scope.words.length) {
                      fontSize.domain([+scope.words[scope.words.length - 1].value || 1, +scope.words[0].value]);
                  }
                  layout.stop().words(scope.words).start();
              }

              scope.exportToPNG2 = function () {

                  var svg = document.querySelector('#wordCloudSVG'); //svg
                  var canvas = document.createElement("canvas");

                  var svgSize = svg.getBoundingClientRect();
                  canvas.width = svgSize.width;
                  canvas.height = svgSize.height;

                  var ctx = canvas.getContext('2d');
                  var data = new XMLSerializer().serializeToString(svg);

                  var DOMURL = window.URL || window.webkitURL || window;

                  var img = new Image();
                  var svgBlob = new Blob([data], { type: 'image/svg+xml;charset=utf-8' });
                  var url = DOMURL.createObjectURL(svgBlob);

                  img.onload = function () {
                      ctx.drawImage(img, 0, 0);
                      DOMURL.revokeObjectURL(url);

                      var imgURI = canvas
                          .toDataURL('image/png')
                          .replace('image/png', 'image/octet-stream');

                      triggerDownload(imgURI);
                  };

                  img.src = url;
              }

              function triggerDownload(imgURI) {
                  var evt = new MouseEvent('click', {
                      view: window,
                      bubbles: false,
                      cancelable: true
                  });

                  var a = document.createElement('a');
                  a.setAttribute('download', 'MY_COOL_IMAGE.png');
                  a.setAttribute('href', imgURI);
                  a.setAttribute('target', '_blank');

                  a.dispatchEvent(evt);
              }

          }
      };
  });

My directive template:

 <div id="wordCloud">
    <button class="basicButton" ng-click="exportToPNG2()">Export to .PNG</button>
    <div id="wordCloudVisualisation"></div>
    <canvas id="WordCloudCanvas"></canvas>
</div>

I hope this solution proves beneficial to others!