title: jQuery connect with lines
body: <p>How can I connect numbers with dotted lines in the below jsfiddle.</p>
  
  <p>I want these lines to start from border of inner circle, either from jQuery or from css.  I mean around border of inner circle start from inner border edge to number , ....... 1, ..... 2 to show guide lines.</p>
  
  <p><a href="http://jsfiddle.net/ineffablep/x03f61db/" rel="nofollow noreferrer">http://jsfiddle.net/ineffablep/x03f61db/</a></p>
  
  <pre><code>function createFields() {
      $('.field').remove();
      var container = $('#container');
      for(var i = 0; i &lt; +$('input:text').val()+1; i++) {
          $('&lt;div/&gt;', {
              'class': 'field',
              'text': i 
          }).appendTo(container);
      }
  }
  
  function distributeFields() {
  
  
      var fields = $('.field'), container = $('#container'),
          width = center.width()*2, height = center.height()*2,
          angle = 0, step = (2*Math.PI) / fields.length;
      var radius = width/2;
      var containerLength=$('input:text').val();
      angle=step* (containerLength-1);
  
      fields.each(function() {
  
          var x = Math.round(width + radius * Math.cos(angle));
          var y = Math.round(height + radius * Math.sin(angle));
              $(this).css({
              right: x + 'px',
              top: y + 'px'
          });
          angle -= step;
  
      });
  }
   var center = $('#center');
  
  $(window).resize(function(height) {
  
      $('#container').width($(window).height()*0.9)
      $('#container').height($(window).height()*0.9)
      var width = $('#container').width() * 0.4;
       console.log("width",$('#container').width());
      console.log("height",$('#container').height());
      var radius = width/2;
      width += 'px';
      radius += 'px';
      center.css({
          width: width, height: width,
          '-moz-border-radius' : radius,
          '-webkit-border-radius' : radius,
          'border-radius' : radius
      });
  
  createFields();
  distributeFields();
      // rest of your code for font-size setting etc..
  });
  
  $(window).resize();
  
  
  $('input').change(function() {
      createFields();
      distributeFields();
  });
  </code></pre>
  
  <p><img src="https://i.stack.imgur.com/zdPSX.png" alt="enter image description here"></p>