Forum Discussion

ysapiyev's avatar
ysapiyev
Responsive Resident
8 years ago
Solved

Absolute position of tooltips

Hi everyone,

 

I have custom visual with vertical scroll bar. And tooltips are positioned by coordinates of elements, therefore some tooltips are at the bottom of the screen or lower How tooltips can be positioned by absolute coordinates?

 

Regards,

Yerkhan

Need Help
  • v-viig's avatar
    v-viig
    8 years ago

    We would recommend to use the following code snippet:

    // rootNode - root DOM element
// e - is mouse event

let rect = rootNode.getBoundingClientRect();
let coordinates = [e.clientX - rect.left - rootNode.clientLeft, e.clientY - rect.top - rootNode.clientTop];

    Ignat Vilesov,

    Software Engineer

     

    Microsoft Power BI Custom Visuals

    [email protected]

6 Replies

  • v-viig's avatar
    v-viig
    Community Champion
    8 years ago

    Do you use Tooltip API? If so, you need to get the absolute postion of the element without scrolling using JavaScript.

     

    Ignat Vilesov,

    Software Engineer

     

    Microsoft Power BI Custom Visuals

    [email protected]

    • ysapiyev's avatar
      ysapiyev
      Responsive Resident
      8 years ago

      v-viig,

       

      I've tried using this:

      var e = window.onmousemove;

                    var posX = e.clientX;
                    var posY = e.clientY;

      However, it doesn't work. How it can be done?

       

      Regards,

      Yerkhan

      • v-viig's avatar
        v-viig
        Community Champion
        8 years ago

        We would recommend to use the following code snippet:

        // rootNode - root DOM element
// e - is mouse event

let rect = rootNode.getBoundingClientRect();
let coordinates = [e.clientX - rect.left - rootNode.clientLeft, e.clientY - rect.top - rootNode.clientTop];

        Ignat Vilesov,

        Software Engineer

         

        Microsoft Power BI Custom Visuals

        [email protected]