Skip to content
This repository has been archived by the owner on Dec 1, 2020. It is now read-only.

esri map inside angular-ui boostrap tab always 400x400 pixels #42

Closed
eliprand opened this issue Apr 6, 2015 · 2 comments
Closed

esri map inside angular-ui boostrap tab always 400x400 pixels #42

eliprand opened this issue Apr 6, 2015 · 2 comments
Labels

Comments

@eliprand
Copy link

eliprand commented Apr 6, 2015

Hi,
first, thank you for providing guidance and examples on how to use Esri's map control with AngularJS. While we are not using angular-esri-map directly, we inspired our code from it.
We are seeing a weird issue when putting the custom map directive inside a tab from angular-ui/boostrap. The map seems to default to 400px by 400px if inside a tab (inside a tabset).

I created a simple plunk to show the issue. If you click on the top links, it will switch between views and you can see that the top map, inside the tabset and tab combination is not taking the full width of the div like the one below (using the manual version of the tabset).
I am still new to plunker and angularJS, so I don't know why the app is not starting directly on the #/map1 url, I set the otherwise() to #/map1. However, if you were to open it in a separate window, select either map1 or map2 tabs, then hit full-refresh (as in Ctrl+F5), you will see that the map loads properly on the first load, but subsequent change of tabs will cause the new map to be reset to 400x400.

This could be a combination of many things (ngView, ngRoute, ui.bootstrap, map), but I was hoping you could provide us with some info as to what can cause the map the reset itself to 400x400 so we can root cause which other component is at fault here.

Regards,

Eric.

@tomwayson
Copy link
Member

@eliprand - we're trying to push this kind of question into forums. See the updated contributing guidelines for links to the appropriate places on GeoNet/GIS Stack Exchange. This is especially true in your case where the issue could be related to just Bootstrap (i.e. not specific to AngularJS) and you're more likely to get the right eyeballs on it there.

I haven't had time to look at your issue. One thing is that you may need to include Esri/bootstrap-map-js or at least some of that code.

If you repost on the forum(s), I'll try to take a look at it when I get a chance (after #38). Hopefully you'll get some other responses there in the mean time.

@tomwayson
Copy link
Member

Closing as I never saw any follow up. If you posted a question to the forums and I missed it, please post link and I'll take a look.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Projects
None yet
Development

No branches or pull requests

2 participants