How to generate a bootstrap popover using javascript with dynamic location

Question

The page that I am creating has several canvas elements which are made into piecharts. I would like to make it so that if I click on a particular section of a piechart, a popover is generated next to it with information about that particular section.

**So my specific question is: ** How can I generate a popover at a specific x and y location on the page? For example, if I was to calculate that the top right corner of the clicked section was at x: 295, y: 400, how would I place the popover that is generated at that position? Javascript or Jquery is fine

that kind of pop over is known as tooltip learn here : http://www.w3schools.com/bootstrap/bootstrap_tooltip.asp — , Jul 08 '16 at 16:52
http://stackoverflow.com/questions/17064913/display-tooltip-in-canvas-graph — max, Jul 08 '16 at 16:53

score 0 · Answer 1 · answered Jul 08 '16 at 16:51

Create a div with style:

<div id="popover"> content </div>

#popover{
    position: absolute;
//    left: <x>px;
//    top: <y>px;
    display: inline-block;
    height: 100px;
    width: 100px;
}

On click set left and right for #popover and show the element.

How to generate a bootstrap popover using javascript with dynamic location

1 Answers1