Получайте очки за касательный круг (или овал) и балансируйте покерные фишки на - PullRequest
Новая
       8

Получайте очки за касательный круг (или овал) и балансируйте покерные фишки на

2 голосов
/ 15 декабря 2010

Я пытаюсь отобразить некоторые фишки для бесплатной игры в покер (клиент HTML / Javascript, сервер Python). Есть места вокруг центра стола. для каждого места я знаю косинус, синус, радиус (расстояние от центра стола) и массив значений / подсчетов.

Я пытаюсь отобразить все фишки, выровненные и сбалансированные по касательной в точке сидения

В изображении: (я не могу создать изображение так: http://i.stack.imgur.com/a4Obw.png)

на данный момент, я написал этот код: 

function balanced_stack( chips, cos, sin, radius ) 
{
    var html = ''

    // I receive a chips array like [ [ 100, 8 ], [ 200, 10 ], [ 500, 7 ] ]
    // so 8 chips of 100$, 10 chips of 200$ .. etc
    for(var i in chips) 
    {
        var value = chips[i][0]; // the token value
        var count = chips[i][1]; // the token count

        var m = 0; // margin for a single stack
        var left = i * 20 * sin + cos * radius;
        var top = -i * 20 * cos + sin * radius;

        for( var j=1; j<= count; j++ ) 
        {       
            html += '<img style="z-index:'+( parseInt(top) + 9999)+'; left:'+left+'px; top: '+top+'px; margin-top:'+( -2*m )+'px;" \
                            src="/images/chips/'+value+'.png" />'
            m ++;
        }

        return html
    }
}

но он не сбалансирован и не очень хорошо выглядит.

добавить: косинус и синус могут быть больше 1 и меньше -1, потому что таблица может быть овальной

Ответы [ 4 ]

1 голос
/ 15 декабря 2010

Если ваш эллипс определяется как {a * cos (x), b * sin (x)}, тангенс равен {-a * sin (x), b * cos (x)}.Использование определения, которое объединяет оси эллипса с синусом / косинусом угла вокруг стола, не позволяет легко извлечь это.Кроме того, кажется плохой идеей называть эту величину sin / cos, поскольку их математическое определение ограничено областью от -1 до +1 ...

0 голосов
/ 16 декабря 2010

Подумайте об этом следующим образом: второе слагаемое для (слева, сверху) в вашем коде находит центр стека. К этому вы хотите добавить стеки по касательной. Поскольку ваши стеки определяются шириной в пикселях, форма термина, добавляемого к центральной точке, может иметь удобную форму i * pxwidth * {nx, ny}, где nx и ny - (x, y) компоненты нормализованный касательный вектор, 'i' - целое число, считающее отдельные стеки, а pxwidth - желаемая ширина пикселя. Если sin и cos являются истинными синусом / косинусом, (-sin, cos) уже является нормализованным вектором, поскольку sin ^ 2 + cos ^ 2 = 1.

Что я не понимаю в вашем коде, так это ((20 * a) -20), что равно 20 * (a-1). Какой-то поправочный коэффициент для> 1. Это не симметрично для b, но тогда оно будет равно нулю для b = 1 ...

0 голосов
/ 16 декабря 2010

Я немного слепо пытался найти решение и писал: (похоже, это работает) 

var left = (i * ((20*a) - 20) * sin * a) + (cos * radius * a); 
var top = -(i * ((20*a) - 20) * cos * b) + (sin * radius * b);

Не могли бы вы объяснить, почему это работает?Я математически слаб.

с 20 поддельными игроками за столом эллипса (a = 1.6, b = 1):

alt text

0 голосов
/ 16 декабря 2010

Я думаю, что я решил проблему касательной с помощью уравнения SEngstrom.Все фишки выровнены по правой касательной.Вы можете увидеть здесь: alt text

function( chips, cos, sin, radius ) 
{
    var html = ''

    // Considering the equation for the tangent {a*cos(x),b*cos(x)}+d*{-a*sin(x),b*cos(x)}
    var a = 1.6; // x coefficient for the ellipse
    var b = 1; // y coefficient for the ellipse


    // I receive a chips array like [ [ 100, 8 ], [ 200, 10 ], [ 500, 7 ] ], so 8 chips of 100$, 10 chips of 200$ .. etc
    for(var i in chips) 
    {
        var value = chips[i][0]; // the token value
        var count = chips[i][1]; // the token count

        var m = 0; // margin for a single stack

        var left = i * 20 * sin * a + cos * radius * a; 
        var top = -i * 20 * cos * b + sin * radius * b;

        for( var j=1; j<= count; j++ ) 
        {       
            html += '<img style="z-index:'+( parseInt(top) + 9999)+'; left:'+left+'px; top: '+top+'px; margin-top:'+( -2*m )+'px;" \
                            class="chip chip_'+value+'" src="/images/chips/'+CHIPS.COLORS[ value ]+'.png" />'
            m ++;
        }       
    }
    return html
}

Но, как вы можете видеть, между каждым стеком есть пробел, потому что чип имеет ширину 20 пикселей, с обычным cos / sin, но это нормально, ноздесь расстояние между каждым стеком увеличивается коэффициентом эллипса (i * 20 * sin * a )

...