Skip to content

Commit

Permalink
Update floorplan doc (step 1)
Browse files Browse the repository at this point in the history
show that you don't need to exactly follow floorplan and generally just try to make it look nice/together
  • Loading branch information
Awesomecar11 authored Mar 20, 2024
1 parent 09a7392 commit 679c3c2
Showing 1 changed file with 5 additions and 1 deletion.
6 changes: 5 additions & 1 deletion docs/create-basic-floor-plans.md
Original file line number Diff line number Diff line change
Expand Up @@ -57,6 +57,10 @@ Here's the first pittsburgh floor as an example next to the pdf floorplan from q

Lastly, make sure to open the XML Editor again and delete every attribute from each of the paths except for `id` and `d` (this gets rid of the coloring and extra attributes).

Some rooms also look weird/don't fit perfectly so it's generally better to slighty fudge the walls to make them look more together, here is an example, the top one is the original and the bottom one was fixed to look a bit better.
![](.embed/create-basic-floor-plans-14.png)
![](.embed/create-basic-floor-plans-15.png)

## 4. Export SVG and Clean it up
Once finished with the floor plan, make sure to delete the first layer with the pdf to leave the paths we created. Right click on the layer with our paths, click `Convert to group`, then right click again and click `Ungroup` to get rid of the outer shell and leave just our paths.

Expand All @@ -79,4 +83,4 @@ Also, SVGs are layered, so make sure your path with the `floor` id is the top on
![](.embed/create-basic-floor-plans-13.png)

## 5. Check!
Perhaps the most important step of the process is to check your work. If you put the svg in the correct folder (`src\assets\floors`) then you should be able to see your floor when you run the app, click on your building, and navigate to the correct floor. If your svg looks funky or if the placement on the screen is off, make the appropriate changes before you ask others to review it! One common issue is the placement of the svg when you load it in the app (the floor svg could look cut off or way too big when you first open the building). This most likely has to do with the background document frame you are working with (take a look at the scaling notes in `Step 2: Open the image` and don't be afraid to leave some space outside of the floorplan itself to aid in viewing in the app).
Perhaps the most important step of the process is to check your work. If you put the svg in the correct folder (`src\assets\floors`) then you should be able to see your floor when you run the app, click on your building, and navigate to the correct floor. If your svg looks funky or if the placement on the screen is off, make the appropriate changes before you ask others to review it! One common issue is the placement of the svg when you load it in the app (the floor svg could look cut off or way too big when you first open the building). This most likely has to do with the background document frame you are working with (take a look at the scaling notes in `Step 2: Open the image` and don't be afraid to leave some space outside of the floorplan itself to aid in viewing in the app).

0 comments on commit 679c3c2

Please sign in to comment.