ngMoegraph

<!DOCTYPE html>
<html>

  <head>
    <meta charset="utf-8">
    <script data-require="angular.js@1.2.0-rc3" data-semver="1.2.0-rc3" src="http://code.angularjs.org/1.2.0-rc.3/angular.min.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-app="ngMoegraph" ng-controller="DemoCtrl">
    Please input anything you like <input ng-model="moetext" />
    <div class="notice"><strong>(Note: Using full-width English and Number)</strong></div>
    <select ng-model="moefont" ng-options="f.name for f in fonts"></select>
    <div ng-moegraph="moetext"  font="moefont"></div>
  </body>

</html>

// Code goes here

angular.module('ngMoegraph', [])
  .controller('DemoCtrl', function($scope) {
    $scope.moetext = '◢███◣　　　　　█▂≡▂｜　炸你全家▊◎－◎｜／　　　　＼　皿／　　　　　　　　︶　　　　　　　'
    $scope.fonts = [{ name: 'kai'}, { name: 'ebas'}, {name:'sung'}];
    $scope.moefont = $scope.fonts[0];
  })
  .directive('ngMoegraph', function() {
    return {
      link: function(scope, element, attrs) {
        var img = angular.element('<img>');
        element.addClass('moegraph')
        img.attr('width', '500px');
        img.attr('height', '500px');
        element.html('');

        scope.$watch(attrs.ngMoegraph, function(thatMoetext) {
          var w, len, padding, total, font, k;
          padding = 0;
          if (thatMoetext) {
            font = scope[attrs.font].name;
            console.log(font)
            len = thatMoetext.length
            w = Math.ceil(len / Math.sqrt(len * 0.5))
            total = Math.ceil(len / w) * w
            if (total > len && len % 4 !== 0) {
              padding = total - len;
            }
            for (i = 0; i < padding; i++) {
              thatMoetext += ' ';
            }
            img.attr('src', 'https://www.moedict.tw/' + encodeURIComponent(thatMoetext) + '.png');
            element.append(img);
          }
        })
      }
    }
  })

/* Styles go here */

.notice {
  height: 20px;
}
.moegraph {
  margin-top: -100px;
}

input {
  width: 350px;
}

strong {
  color: red;
}