How to Fix Azure Maps PCF Component Drawing Tools Offset

1
votes

I have an Azure Maps PCF Component imported as a solution into a PowerApp.

  • If a pin is dropped in the upper-left corner, it falls directly under the cursor (like it should).
  • As I drop pins down and to the right, the pins fall increasingly further from the cursor (problem)
  • This also happens when drawing vertices of polygons and origins of circles/squares

Example: enter image description here

Additional findings:

  1. Offset distance and direction changes depending on browser window size enter image description here

  2. Inspect div's enter image description here

Where would I look in the source code to find the fix for this issue?

1
powerappsazure-mapspowerapps-component-framework
I wasn't able to reproduce this with the drawing tools on their own. Will ask one of our devs to take a look to see if they can reproduce. - rbrundritt
Dev took a look and wasn't able to reproduce. Can you try the following sample in the same browser to see if it reproduces for you: azuremapscodesamples.azurewebsites.net/Drawing%20Tools%20Module/… Also try your control in other browsers to see if it happens there too. One last thing, can you inspect the map div to see if a transform is being done on the map, for example, a scale transform. I've seen that cause issues with some other things before. - rbrundritt
Thank you for looking into this issue. The sample you provided works as intended. Please see OP for more findings: 1. Offset distance from cursor changes depending on browser window size. 2. I'm not sure which div to inspect as many highlight the map control. One other critical item: This is a PowerApps CANVAS app, not a Model-driven app. - SeaDude
A canvas Power App will scale to fit the window; this could be causing the issue. - Greg Hurlman
Hi @GregHurlman. Do you know how to address this in the PCF code or where I might look? - SeaDude

1 Answers

0
votes

The offset was due to the following settings. When turned to "Off", the offset disappeared: enter image description here