Premium support for our pure JavaScript UI components


Post by bherford »

I am having trouble implementing the

align

config, in tandem with the

showBy

function when adding a popup:

        this.timeRangeMenu.showBy({
            target: document.getElementById('toggleTimeRangeMenu'),
            align: {
                t: 100,
                r: 0,
                b: 0,
                l: 1000
            }
        });

is "t,r,b,l" correct?


Post by Animal »

The align is a string.

It describes the widget's alignment point followed by the target's alignment point. The point is a percentage along an edge.

so align : 't100-b100' means my top right point is aligned to the target's bottom right point


Post by bherford »

Thanks for the note Animal, this is helpful.

To take this a little further, what is generating this inline style on the popup container?
(snippet from the browser):

Screen Shot 2022-09-20 at 10.29.25 AM.png
Screen Shot 2022-09-20 at 10.29.25 AM.png (79.41 KiB) Viewed 185 times

Post by Animal »

That's the positioning of the popup element. The setXY method in widget will do that.

I have updated the docs to look like this:

Screenshot 2022-09-20 at 16.47.29.png
Screenshot 2022-09-20 at 16.47.29.png (136.85 KiB) Viewed 183 times

Post by bherford »

Thanks


Post Reply