Did you explore the support site. If not then please refer below link and see if it helps.

https://www.qualtrics.com/support/survey-platform/survey-module/editing-questions/question-types-guide/specialty-questions/heat-map/

Yes, I did. I read that whole article that you linked but it does not answer my question. The most relevant information is here:

In the exported dataset, 2 columns will be provided for each click participants were allowed to make on the image. 1 column will include the x-coordinates of each click (from the top-left of the image), and the other will include the y-coordinates of each click (from the top-left of the image), both measured in pixels.

But it says nothing about where the boundaries of the regions are, or how to get that information.

Hi, I don't think there is an easy way to get to this information, but I think there are 2 approaches you could take. The first and easiest is to generate a bunch of Test Responses, download the data to Excel, add a filter for Region 1 = 1, then look at the min and max values in the x and y coordinate columns. When I used a test image on my end with 700 test responses and a square Region 1, I got x min = 316, x max = 463, y min = 172, y max = 319.

The the more precise but difficult to parse approach would be to inspect the browser when viewing the Heat Map in the Survey Builder. The Region 1 element can be navigated to and the element should look something like the below:

<path fill="none" stroke="#ffffff" d="M315.5,169.5C315.5,169.5,465.5,169.5,465.5,169.5C465.5,169.5,465.5,319.5,465.5,319.5C465.5,319.5,315.5,319.5,315.5,319.5C315.5,319.5,315.5,169.5,315.5,169.5" stroke-linejoin="round" stroke-linecap="round" stroke-width="4" opacity="0.2" transform="matrix(1,0,0,1,0,0)" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); stroke-linejoin: round; stroke-linecap: round; opacity: 0.2;"></path>

I see values in there that I believe are related to the positioning of the Region within the Heat Map image. I think the values parse out to x min = 315.5, x max = 465.5, y min = 169.5, y max = 319.5.

@Tom_1842 thank you, this solved it for me! I used the inspect element feature of my browser and using this site: https://css-tricks.com/svg-path-syntax-illustrated-guide/ I was able to interpret the numbers and get the coordinates. For anyone who searches for this in the future, here is the break down of my solution.

The inspected element:

<path fill="none" stroke="#ffffff" d="M156.5,156.5C156.5,156.5,1244.5,156.5,1244.5,156.5C1244.5,156.5,1244.5,1244.5,1244.5,1244.5C1244.5,1244.5,156.5,1244.5,156.5,1244.5C156.5,1244.5,156.5,156.5,156.5,156.5" stroke-linejoin="round" stroke-linecap="round" stroke-width="4" opacity="0.2" transform="matrix(1,0,0,1,0,0)" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); stroke-linejoin: round; stroke-linecap: round; opacity: 0.2;"></path>

My interpretation (from d=”...”):

M156.5,156.5

# start location
 

C156.5,156.5,

# bezier point 1
 

1244.5,156.5,

# bezier point 2
 

1244.5,156.5

# bezier point 3

# first line from 156.5,156.5 to 1244.5,156.5

C1244.5,156.5,1244.5,1244.5,1244.5,1244.5

# second line from 1244.5,156.5 to 1244.5,1244.5

C1244.5,1244.5,156.5,1244.5,156.5,1244.5

# third line from 1244.5,1244.5 to 156.5,1244.5

C156.5,1244.5,156.5,156.5,156.5,156.5

# fourth line from 156.5,1244.5 to 156.5,156.5