Absolute position of tooltips

[ysapiyev]

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

[v-viig]

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

pbicvsupport@microsoft.com

[ysapiyev]

@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 · Accepted solution]

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

pbicvsupport@microsoft.com

[Anonymous]

I have a flow map visual in which tooltips are overflowing out of page.

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

Will the above code work and where should i exactly put this code to work ?

[v-viig]

I think so. You should add this code to a function that generates coordinates for Tootip Service.

Ignat Vilesov,

Software Engineer

Microsoft Power BI Custom Visuals

pbicvsupport@microsoft.com

[ysapiyev]

@v-viig,

Thanks! It helped.

Regards,

Yerkhan