Available for an ArcGIS organization licensed with the Indoors extension.
You can use 2D SVG and PNG graphics built outside of ArcGIS Pro in ArcGIS Indoors and client apps. The following sections describe how to create custom SVG or PNG symbols that can be added to an ArcGIS Pro project and the Indoor Viewer, ArcGIS Indoors for iOS, and ArcGIS Indoors for Android client apps.
Colors
Most projects are designed with a specific color palette. If you are creating SVG symbols in a graphic design program such as Adobe Illustrator, you need to define your document’s color mode as RGB. This ensures that the colors you use in the graphic design program display as expected in the Indoors final product. Conversely, this allows you to manually type or paste the hexadecimal values directly into your graphic design document from ArcGIS Pro. For example, if you create point symbols in a graphic design program after the maps are created in Indoors, you can enter the color values from ArcGIS Pro to your graphic design program.
Perform the following steps to copy the symbology color values from Indoors and paste them into your design program:
- Click the symbol preview in the Contents pane.
The Symbology pane appears.
- Click the Properties tab.
- Click the color indicator drop-down arrow in the Appearance group, and click Color Properties to get the color values.
- Copy the hexadecimal value from the Color Editor into your graphic design program.
Symbol size
The following are recommendations for SVG and PNG formats:
SVG format
Although SVG graphics are scalable, it is recommended that you design your symbols at or near the size you intend them to be in your Indoors project. This will help you design a symbol that is legible in the final output. Keep in mind that your symbol will need pictographs that are easily understood in an interactive map. Complex symbols with a lot of detail can become difficult to read at their intended size.
PNG format
PNG graphics are raster images, so you need to be specific about the size. Keep in mind that your symbol will be very small. When you are designing the pictograms, make sure you zoom out to roughly the size that the PNG symbol will be to get an idea of the final output’s appearance.
Note:
The Indoors PNG symbols use pixel sizes: 23 pixels, 43 pixels, and 69 pixels. These sizes work well across web and mobile platforms.
Layer management and file size reduction in the graphic design program
When creating icons and map symbols in a graphic design program, the following practices are common in file maintenance:
- Use one file for all symbols. This is a great way to manage symbols and icons.
- Switch the visibility of the pictographs needed for the symbol, and save that state to create a symbol as a raster or vector symbol instance.
SVG format
When creating an SVG symbol, all layers in the file are saved in the SVG code, regardless of their visibility status. This can cause SVG files to be much larger than necessary. The following are best practices for creating SVG files:
- When creating a symbol design, use one file for all symbols. When saving a symbol, delete all the artwork from your file that is not part of the symbol’s artwork, and save it as a new SVG file.
- Alternatively, create a separate file for each symbol that you design and save each in SVG format.
PNG format
When designing PNG symbols in Illustrator or a similar graphic design program, you can use the same main file to make PNG symbols.
Tip:
Unlike creating SVG symbols in Illustrator, you do not need to remove layers before you save the design as a symbol.
Add a custom point symbol
After you’ve created your symbols, you can add them to ArcGIS Pro by performing the following steps:
- Right-click the layer to which you want to add custom symbols in the Contents pane and click Symbology.
The Symbology pane appears.
- Click the point symbol you want to change.
The Format Point Symbol pane appears.
- Click the Properties tab to open the symbol properties.
- Click the Layers button
. The Layers tab appears.
- Define the type of symbol that you want to use by clicking the drop-down menu next to the symbol preview.
- Choose Picture marker when using raster symbols, such as PNGs or JPGs.
- Choose Shape marker when using vector symbols, such as SVGs.
- If necessary, expand the Appearance group.
- Click File under Insert picture from and browse to your custom symbol file.
- Optionally, adjust the size of your symbol by clicking the up or down arrow in the Size entry box, or manually enter the size.
The preview at the bottom of the Symbology pane gives you an indication of how the symbol will appear on your map. Increase or decrease the point size until you have the optimal size for your map. Note that the point size in the Symbology pane may differ from the pixel or point size you defined in your graphic design program.
Note:
- For Picture markers, the size is predefined in the file, but you can change it. Click Reset size to return to the predefined size.
- For Shape markers, the symbol size is not predefined in the file. For example, if the original symbol's default size is 4 point, the SVG symbol you chose in step 3 appears as a 4 point symbol as well. SVG symbols are scalable, so you can update them.
- For Shape markers, optionally check the Respect frame check box.
- Checked—The marker's Size property corresponds to the height of the marker's frame.
- Unchecked—The marker's Size property corresponds to the height of the marker's graphic geometry.
- For Shape markers, optionally check the Scale proportionally check box to have elements of the marker resize proportionally when the marker is resized by changes at the symbol or feature layer level.
- Click Apply at the bottom of the Symbology pane to apply the symbol to your map project.
- Optionally, adjust the symbol layer properties.
- Optionally, save the custom embedded symbol for reuse.