cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Highlighted
Helper I
Helper I

Interactive office map

Ok so I would love to create an interactive office floor plan where you can search for a member of staff/ room/ equipement, and have it display on the map with information.

 

There are some applications like this you can purchase (e.g. OfficeMaps.com) but having one in PowerApps would be even better to intergrate with SharePoint and have as a mobile app etc.

 

Obviously it would need to connect to Active Directory/ Office 365 users. And I have copies of the floor plans so don't need to use Google or Bing maps. So if anyone could point me in the right direction on how to start - i'm sure many others would like something like this for this organisation!

14 REPLIES 14
Highlighted
Super User III
Super User III

Go for it!!

We do this for equipment.  The trick is you need to create a coordinate system like a geocode for the floor.  That can then be turned into some math formulas for X and Y coordinates of icons overlayed on an image.

Give it a shot, you might be surprised how easy it is.

The only trick is the format - viewing on a phone can cause a trip to the eye doctor.

 

As for the connecting to AD...I doubt that will be relevant to the placement of graphics. But it would be good for getting more details on people and resources.

_____________________________________________________________________________________
Digging it? - Click on the Thumbs Up. Solved your problem? - Click on Accept as Solution. Others seeking the same answers will be happy you did.
Check out my PowerApps Videos too!
Highlighted
Super User
Super User

Hi @mbutterz. I recently posted a video on this. Check it!: https://www.youtube.com/watch?v=SXBCR1Us1Jk

Highlighted

@seadudenice video!  

_____________________________________________________________________________________
Digging it? - Click on the Thumbs Up. Solved your problem? - Click on Accept as Solution. Others seeking the same answers will be happy you did.
Check out my PowerApps Videos too!
Highlighted

Right on @RandyHayes. Is that what you were looking for?

Highlighted

@seadudeit's very similar to what we do.  As I mentioned in the first response to @mbutterz we do this today for equipment mapping (we show where equipment is located on an office map).

So, we're putting a image of a floor plan on the canvas and then overlaying a gallery just like you did for the map video.

Our challenges were 1) doing a coordinate system that made sense 2) providing an ability to zoom in and out and scroll.

 

For #1, you know what I'm talking about.

For #2, did a little trick of splitting the floor plan into multiple images all scaled larger (imagine cutting a square into four quarters and making each the size of the original square - or in many cases, multiple scaled images).  Then recorded this in a table with four additional columns (leftImg, rightImg, upImage, downImage).  Based on that we could diplay an image, know if it had surrounding imaged to "scroll" to and then place navigation arrows on the screen to go to the requested.

Then, on top of that is the gallery with the information to actually map.

The challenge was (as mentioned) coming up with a coordinate system (we chose to use a grid system), store the grid location with the equipment data and then to do the math to place the icon, labels, etc. on the proper places.

A little snip image of it is here. (BTW, there is a black rectangle underneath the image that we place based on if there is no up, down, left, or right. That way the user gets a better feel of the perimeter of the map.)

 

snip.png

_____________________________________________________________________________________
Digging it? - Click on the Thumbs Up. Solved your problem? - Click on Accept as Solution. Others seeking the same answers will be happy you did.
Check out my PowerApps Videos too!
Highlighted

I have been trying to give this a go without much luck. I followed the video and setup a sharepoint list with all the x and y coords of my icons, i even went one step further to add in Height and Width too. I placed all of my icons onto my screen and then went one by one recording the x,y,height and width information. 

However when i then plug that into the gallery for the x,y,height and width they do not line up .

Heres some snips to show what i mean. The first picture is the icons placed on the background image, the way i would like them to be displayed. 

fm1.PNG

 

The second image is what it looks like in the gallery using the same coords as the top image

 

fm2.PNG

 

As you can see the icons are not lining up the way that they should be. Im not sure if something has changed since the video was made. If anyone has a solution to this it would be grealty appreciated. 

Highlighted

To be honest I've given up on PowerApps for all projects.

 

It's a really unstable platform and just not worth the time it takes to make the simplest thing work.

 

You're better off looking at third party applications.

Highlighted

You need to offset the image x / y cords e.g. ThisItem.XCords -3, ThisItem.YCords -3

Highlighted
Frequent Visitor

As a follow up to this, adding more objects/markers increases the Y Cord gap. I solved this by adding a sort order numerical column to my underlying data, sorted Gallery, Items by the SortID and then just adjusted the Y cords accordingly (which were also coming from an external dataset - a sharepoint list in this instance but could also be a spreadsheet).

 

I've used this overlay technique as a seating / floor plan. The layout doesn't change that often (only the people), so this approach is perfect for my needs.

Helpful resources

Announcements
Community Conference

Power Platform Community Conference

Check out the on demand sessions that are available now!

News & Announcements

Community Blog

Stay up tp date on the latest blogs and activities in the community News & Announcements.

secondImage

Power Platform 2020 release wave 2 plan

Features releasing from October 2020 through March 2021

Community Highlights

Community Highlights

Check out the Power Platform Community Highlights

Top Solution Authors
Top Kudoed Authors
Users online (11,640)