Search code examples
javascriptraphaelgraphael

gRaphael popup positions


from what I can see, gRaphael only supports 4 positions for placing a popup, up,down,left and right, normally this would be enough, but my line graph has limited space, so the popups are cutting off inside of the SVG. My question is, how can I place the popup in say the up right (top right), up left (top left), down right (bottom right) or the down left (bottom left) position?


Solution

  • I ended up using qTip, like so...

    //show the tooltip
    showTip(column.node,column.symbols[0].node,"label",tailPos,tipPos);
    
    function showTip(selector,target,content,tailPosition,tipPosition)
    {
        $(selector).qtip({
            content: content,
            position: {
                my: tailPosition,   //tip tail position
                at: tipPosition,    //tip body position
                target: $(target)   //position the tip at this element
            },
            show: {
                ready: true //show popup
            },
            style: {
                classes: 'ui-tooltip-rounded ui-tooltip-dark'
            }
    
        });
    }
    

    worked perfectly. :)