Define a custom map theme
When designing and configuring a report, report authors can define the look of the map layout by applying one of six predefined themes or by modifying one of these themes for the current report. In a theme, the following map layout elements are defined:
- Menu
- Menu text
- Menu highlight
- Menu icon color
- Highlight
- Default font
For more information, see Configure map settings and tools.
In addition, system administrators can create custom themes for their organization. Custom themes are defined in themes.json.txt. Once defined, a custom theme becomes available to report authors to apply to reports they are configuring.
- Browse to <em4c_ location>\webcontent\esrimap\em4c-bisprovider\config\design\.
- Make a copy of themes.json.txt.default and rename it to themes.json.txt.
- Open themes.json.txt in a text editor such as Notepad.
A custom Light Blue theme has already been added to the file.
- Modify the file to include additional themes as needed. The following sample code includes three custom themes to use as a guide:
{ "themes": [ { "name": "theme1", "css": { "headerColor": "#828282", "headerHoverColor": "#01709d", "accentColor": "#3093ca", "accentTextColor": "#ffffff", "fontFamily": "'Segoe UI', Avenir, 'Helvetica Neue', Arial, sans-serif", "menuIconColor": "gray" //options are white, gray, black } }, { "name": "theme 2", "css": { "headerColor": "#b3f189", "headerHoverColor": "#076b2c", "accentColor": "#b3f189", "accentTextColor": "#101b14", "fontFamily": "Tahoma, Geneva", "menuIconColor": "black" } }, { "name": "theme 3", "css": { "headerColor": "#828282" } } ] }
Note:
If only some of the available settings are provided for a theme (as in theme 3 in the sample), the equivalent settings for the Blue (default) theme will be applied for the missing settings.
- Verify that the JSON file is still valid.
- Save the file.
- Clear your browser cache.
- Verify that your custom themes appear in Report Authoring mode as follows:
- From the Advanced menu, choose Configure.
- Click the Layout tab.
- Expand the Theme drop-down menu.
The custom themes you created should be listed. If two or more themes have the same name, a number is appended to the name of each duplicate theme. If the JSON file has errors, the custom themes are not displayed in the list.
- Choose a custom theme you defined and click Customize to ensure the settings were defined correctly. Repeat this step for any other custom themes you defined.
- Click Cancel when finished.