優雅的方式來定位兩個矩形

Question

我有一個矩形（稱爲目標），並希望放置另一個矩形（稱爲衛星）旁邊。該衛星有一個位置（頂部，底部，左側，右側），用於確定相對於目標的放置邊緣。它還有一個對齊方式（左，中，右爲頂部和底部位置，頂部，中部和底部爲左右位置）。

實施例：

+----------+----------------------------+ 
|   |       | 
| Target | Satellite, Position=RIGHT, | 
|   | Align=TOP     | 
|   |       | 
|   |----------------------------+ 
|   | 
+----------+ 

我知道左上座標的目標以及其寬度和高度的。我也知道衛星的寬度和高度，並且想要計算它的左上角座標。我可以將它作爲一系列12 if從句，但也許有更優雅的數學或算法的方法來完成它。有沒有其他的方法來解決這個問題：

# s = satellite, t = target 
if pos == "top" && align == "left" 
    s.x = t.x 
    s.y = t.y - s.height 
else if pos == "top" && align == "center" 
    s.x = t.x + t.width/2 - s.width/2 
    s.y = t.y - s.height 
# etc, etc 

Ruby或JavaScript的任何好的解決方案？

Answer 1

如果您使用的一系列對象會做的伎倆：

 
var positions = { 

    top: {left:{x:t.x, y:y.y-s.height}, center:{x:tx.x + t.width/2- s.width/2, y:t.y-s.height}} 
    //etc.... 
} 
//then to get the position you can simply 
var pos = positions[pos][align]) 

Answer 2

我喜歡對方的回答，但這裏是如何做到這一點，而不必存儲任何。所有使用javascript true評估爲1且false在算術運算符應用時評估爲0的技巧的所有數學和邏輯：

p .s. （檢查工作的jsfiddle：http://jsfiddle.net/vQqSe/52/）

var t = { 
    jq: $('#target'), 
    width: parseInt($('#target').css('width')), 
    height: parseInt($('#target').css('height')), 
    top: parseInt($('#target').css('top')), 
    left: parseInt($('#target').css('left')) 
}; 
var s = { 
    jq: $('#satellite'), 
    width: parseInt($('#satellite').css('width')), 
    height: parseInt($('#satellite').css('height')) 
}; 

// start with it top left and add using javascript tricks 
s.jq.css('top', t.top - s.height + 
    s.height * (a == 'top') + 
    (t.height/2 + s.height/2) * (a == 'middle') + 
    t.height * (a == 'bottom') + 
    (t.height + s.height) * (p == 'bottom') 
);   

s.jq.css('left', t.left - s.width + 
    t.width * (a == 'left') + 
    s.width * (a == 'right') + 
    (s.width/2 + t.width/2) * (a == 'center') + 
    (s.width + t.width) * (p == 'right') 
); 

Answer 3

def vector pos, align, hash 
    case hash[pos] 
    when -1;  [0.0, -1.0] 
    when 1;  [1.0, 0.0] 
    else 
    case hash[align] 
    when -1; [0.0, 0.0] 
    when 1; [1.0, -1.0] 
    else  [0.5, -0.5] 
    end 
    end 
end 

y_t, y_s = vector(pos, align, "top" => -1, "bottom" => 1) 
x_t, x_s = vector(pos, align, "left" => -1, "right" => 1) 
s.y = t.y + y_t*t.height + y_s*s.height 
s.x = t.x + x_t*t.width + x_s*s.width 

或

def vector pos, align, head, tail 
    case pos 
    when head; [0.0, -1.0] 
    when tail; [1.0, 0.0] 
    else 
    case align 
    when head; [0.0, 0.0] 
    when tail; [1.0, -1.0] 
    else  [0.5, -0.5] 
    end 
    end 
end 

y_t, y_s = vector(pos, align, "top", "bottom") 
x_t, x_s = vector(pos, align, "left", "right") 
s.y = t.y + y_t*t.height + y_s*s.height 
s.x = t.x + x_t*t.width + x_s*s.width