2012-12-10 48 views
2

,使用此代碼:繪製邊框的任意位置組形狀與我使用RaphaelJS繪製了一套在紙張上的隨機位置的形狀RaphaelJS

http://jsbin.com/ixiqiy/2/edit

我是什麼現在想做的是找到最外面的一組職位,這樣我就可以在整個團隊周圍畫一個邊框。例如:

enter image description here

誰能幫助?謝謝。

+0

@EliranMalka - 不問這個問題構成了這裏的研究一種形式? –

+1

好吧,你應該先研究其他資源(例如至少試着解決你自己的問題),以獲得觀衆的同情。 –

+0

我確實看過,但找不到任何東西,主要是因爲我不知道我在找什麼。一旦我發現這被稱爲「凸包」,我設法找到了一些很好的資源,並提出了一個解決方案,我將在下面發佈。 –

回答

2

OK,所以使用Jarvis March算法和this Python實現我已經成功地把我的自己的JS/RaphaelJS解決方案,它可以在這裏找到:http://jsbin.com/ixiqiy/12/edit

就在有史以來消失,這裏的代碼情況:

(function() { 

    function cmp(x, y) { 
     if (x > y) { 
      return 1; 
     } else if (x < y) { 
      return -1; 
     } else { 
      return 0; 
     } 
    } 
    function turn(p, q, r) { 
     return cmp((q[0] - p[0]) * (r[1] - p[1]) - (r[0] - p[0]) * (q[1] - p[1]), 0); 
    } 
    function dist(p, q) { 
     var dx = q[0] - p[0]; 
     var dy = q[1] - p[1]; 
     return dx * dx + dy * dy; 
    } 
    function next_hull_pt(points, p) { 
     var q = p, 
      r, 
      t; 
     for (var i = 0; i < points.length; i++) { 
      r = points[i]; 
      t = turn(p, q, r); 
      if (t == -1 || t == 0 && dist(p, r) > dist(p, q)) { 
       q = r; 
      } 
     } 
     return q; 
    } 
    function convex_hull(points) { 
     var left, 
      point; 
     for (var i = 0; i < points.length; i++) { 
      point = points[i]; 
      if (!left || point[0] < left[0]) { 
       left = point; 
      } 
     } 
     var hull = [left], 
      p, 
      q; 
     for (var i = 0; i < hull.length; i++) { 
      p = hull[i]; 
      q = next_hull_pt(points, p); 
      if (q[0] != hull[0][0] || q[1] != hull[0][1]) { 
       hull.push(q); 
      } 
     } 
     hull.push(left); 
     return hull; 
    } 

    var paper = Raphael(0, 0, 800, 800), 
     set  = paper.set(), 
     points = [], 
     point; 

    for (var i = 0; i < 20; i++) { 
     points[i] = [ 
      Math.round(Math.random() * 500) + 100, 
      Math.round(Math.random() * 500) + 100 
     ]; 
    } 

    for (var i = 0; i < points.length; i++) { 
     point = points[i]; 
     set.push(paper.circle(point[0], point[1], 5)); 
    } 

    set.attr('fill', '#ff0000'); 
    set.attr('stroke', '#ffffff'); 

    var outline  = convex_hull(points), 
     previous = [0, 0], 
     path  = 'M'; 
    for (var i = 0; i < outline.length; i++) { 
     point = outline[i]; 
     path = path + (i == 0 ? 'M' : 'L') + point[0] + ',' + point[1] + ' '; 
    } 

    var path = paper.path(path); 
    path.attr('stroke', '#0000ff'); 

})();