D3.js donut chart

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.17/d3.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<body>
  <div class="exp"></div>
</body>

CSS

.donut-pie-tooltip-bubble {
  background-color: #ffffff;
  color: #06346e;
  font-size: 11px;
  padding: 6px 12px 6px 12px;
  border-radius: 2px 2px 2px 2px;
  box-shadow: 1px 1px 1px 1px rgba(25, 25, 25, 0.15);
  text-align: left;
  max-width: 240px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

JavaScript

$(document).ready(function() {

  /**
   [
       {"name" : "JavaScript", "hvalue" : 20 },
       {"name" : "d3", "hvalue" : 2},
       {"name" : "jQuery", "hvalue" : 25},
       {"name" : "SVG", "hvalue" : 5}
  ]
   */
  function get_data() {
    var props = ['javascript', "d3", "jQuery", "SVG"];
    var out = [];
    for (var i = 0; i < props.length; i++) {
      out.push({
        "name": props[i],
        "hvalue": Math.floor(Math.random() * 100)
      });
    };
    return out;
  }

  // init the pie
  $(".exp").donutpie();

  // update it with some fake data
  $(".exp").donutpie('update', get_data());

  // keep updating every x sec
  setInterval(function() {
    $(".exp").donutpie('update', get_data());
  }, 1200);


});



(function($) {

  var DonutPie = function($self, options) {
    this.$self = $self;
    this.settings = $.extend($.fn.donutpie.defaults, options);
  };

  DonutPie.prototype.display = function() {

    var radius = this.settings.radius / 2;

    this.svg = d3.select(this.$self[0])
      .append("svg")
      .attr("width", radius * 2)
      .attr("height", radius * 2)
      .append("g");

    this.svg.append("g")
      .attr("class", "slices");

    this.pie = d3.layout.pie()
      .sort(null)
      .value(function(d) {
        return d.hvalue;
      });

    this.arc = d3.svg.arc()
      .outerRadius(radius * 0.8)
      .innerRadius(radius * 0.4);

    this.outerArc = d3.svg.arc()
      .innerRadius(radius * 0.9)
      .outerRadius(radius * 0.9);

    this.svg.attr("transform", "translate(" + radius + "," + radius + ")");

    var tpClass = this.settings.tooltipClass;
    if (!$('body').hasClass(tpClass)) {
      $('.' + tpClass).remove();
      d3.select("body")
        .append("div")
        .attr('class', tpClass)
        .style("position", "absolute")
        .style("z-index", "100")
        .style("visibility", "hidden")
        .text("");
    }

  };

  DonutPie.prototype.update = function(data) {

    // check if all the items...