nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Elevation Profile Widget window width was significantly reduced with last ArcGIS Online update.

BruceRiesterer

The width of the elevation profile widget window is much narrower than it was before the last ArcGIS Online update in instant apps 3D viewer. The widget has lost much of its value for analyzing surfaces with the new width.

Prior to update:

After Update:

Can the widget window width be restored to the wide setting?

Find more posts tagged with

3D Viewer

Accepted answers

khutchins

You can use the custom CSS option in the app configuration to make the elevation profile window wider. To do this configure the app and navigate to Theme & Layout > Theme then find the Custom CSS and use the edit option to add this css to the app.

.profile-container , .esri-elevation-profile.esri-widget.esri-widget--panel{
width:60vw;
}

In the example above we use viewport units (vw) which will set the elevation profile panel to be 60% of the viewport (browser window) width. You can modify that number to fit your needs. Here's an example of how it looks in action

Screenshot 2024-07-22 at 4.10.29 PM.png

All comments

khutchins

.profile-container , .esri-elevation-profile.esri-widget.esri-widget--panel{
width:60vw;
}

Screenshot 2024-07-22 at 4.10.29 PM.png

BruceRiesterer

Thanks Kelly! The Custom CSS code works great. Now I 'm trying to find the correct code to position the panel at the bottom-right of the screen.

khutchins

@BruceRiesterer you can use the position manager in the app configuration and drag the elevation profile button to the bottom right corner. Then when you open the profile tool it will be in that corner.

BruceRiesterer

I should have stated that I want to keep the widget button on the upper right side of the app. Is it possible to open the widget panel in bottom-right with Custom CSS Code, but keep the widget button on the upper right side?

khutchins

I played around with it a bit and due to the way the elevation component is contained in the expand its tricky (and might not be doable) with just custom CSS.

But we are planning to enhance the component for the fall release of ArcGIS Online to add an option to dock the container for the profile widget to the bottom or top of the app when its open so keep an eye out for that later this year.

BruceRiesterer

Docking the elevation profile widget component will be a great improvement. Thanks Kelly!

Join the Conversation

Signed in members can post, follow updates, and more. New here? Register a free account.

Quick Links

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.