Create Your own 2D Objects by Importing SVG Files

Create SVG files for your customized objects and import them in magicplan.

magicplan offers the possibility to create a custom object based on a SVG file.
The process of inserting the SVG file is rather easy but the file itself has to be created correctly.

magicplan only supports SVGs made of vector graphic shapes such as paths and outlines consisting of straight lines and curves. The SVGs should not have a picture or photo on the background. There should be no <css> included in the SVG code.


Converted images from PNG, JPG, DWG, DXF formats to SVG format are incompatible, as the illustrator saves the original image on the background of the generated SVG. magicplan uses Nano SVG for this feature. That means, in general, for SVG creation you can rely on all the information that can be found here.

Note: If you don't feel confident creating SVGs that follow these specifications, you can also create a custom object based on an existing object or draw the object using an editor in the magicplan app. It is really easy. Read this article to see how it works.

 

A useful program to create SVG drawings is Graphic. It is available for Mac computers and for iPads. You can directly export your drawings in compatible SVG formats.

Some of our users also like to use Adobe Illustrator to create their custom drawings. If you want to use this software, please make sure to follow the next steps in order to successfully export and save them in a compatible SVG format:

  1. Select File > Export > Export as
  2. Choose Format: SVG (svg)
  3. Choose the following options:
    - Styling: Inline Style
    - Font: SVG
    - Images: Embed
    - Object IDs: Unique
    - Decimal: 2
    - And select „Minify” and „Responsive”
  4. Click OK

Importing the SVG in magicplan

When you have made sure that your SVG file meets all the necessary requirements to be imported in magicplan you are good to go. Follow these steps:

  1. Go to floor level or room level and tap "Insert Object" on the bottom left corner of your screen.
  2. On the bottom of the scroll-down menu you find the option "New Object".
  3. You will be asked if your new object should be based on an existing item. Select "no".
  4. A screen will pop up where you can edit your object. You can easily adjust all the attributes. 
  5. To import your SVG file, tap on the grey field with the pen in the background.
    You have two options:
Option 1: "Paste SVG link"

If you have a weblink that leads to an SVG file copy it before you open magicplan. By tapping "Paste SVG link", the picture from that link will be imported.

Note: You need to make sure that the link leads to a URL which is public and which can be accessed by the app. If it derives from a private account which requires a login of the user, the app can not access it.


Option 2: "Import from another app"

Leave the magicplan app at that stage, go to the app where your SVG is saved, select the option “Export” and select magicplan. You are then redirected to magicplan and the SVG is added to your custom object.

Note: If the SVG file you are trying to upload to the app is not compatible, it will keep loading without a result and you will eventually receive a message about the incompatibility. Alternatively, it might even cause a crash in the app

 

Have fun creating your own objects!

 

Note: If you choose to create an object from scratch, there will be no image to associate with your object for elevation view and it will not render in 3D. To get your custom objects to render in 3D, you may contact our Sales Team. They will get in touch with you to find the perfect solution for you.

Tip: You can also edit or delete the created object. To do so go to the object category where you saved it. Then double-tap the object. A menu with all the possible editing options will open. If you scroll down to the bottom of the menu you will also find the option to delete the object.