Thanks!
]]>I’m having a really odd issue that I cannot figure out. If someone goes directly to the site: www.waahonua.com, on a mobile phone, then clicks “Voyage Dashboard” from the menu bar, they get directed to the mobile version of the Esri (ArcGIS) dashboard as they should. However, if (also using a mobile device), they type in the direct url for that page (https://waahonua.com/voyage-dashboard/), it only shows the desktop version, which looks terrible.
Why is that? And more importantly, how can I fix the issue?
Thanks in advance!
]]>Me again, with another issue with aspect ratio and mobile responsiveness.
On the link that I need help with (bottom of post), I’ve applied some CSS code that I researched; it works perfectly for mobile responsiveness and scaling in other instances (for example, YouTube videos, Prezi, Powerpoint, etc). I’ve watched LOTS of videos, read quite a few tutorials, and tried everything that was suggested. However, I’m still having issues.
Here’s the issue: if you view the page in the full desktop or even tablet configuration, it looks fine. However, once you start shrinking it down after a certain point, despite the fact that the aspect ratio remains as it should, the screen and functionality become unusable: you can’t scroll, you can’t click on any of the nav buttons on the embedded content within that iframe. Have a look and you’ll understand what I mean.
What could I be doing wrong?
How can I fix it?
Here’s the CSS code I wrote, which was taken from one of the tutorials I saw. Again, this works in other cases, but not this particular content in the iframe.
.responsive2 {
overflow: hidden !important;
padding-top: 35px !important;
padding-bottom: 56.25%;
height: 0;
position: relative !important;
}
.responsive2 iframe #story-map {
position: absolute !important;
top:0 !important;
left: 0 !important;
width: 100% !important;
height: 100% !important;
}And here is the html embed code:
<div class="responsive2">
<iframe width="100%" height="800" frameborder="0" scrolling="yes" margin="0 0 5% 5%" id="story-map" src="https://na-alii.maps.arcgis.com/apps/MapJournal/index.html?appid=c37ca5637eb045c8921731a730d0d647"></iframe>
</div>Additionally, if you’d like to see what mobile responsiveness looks like without the CSS code, you can click here. You’ll notice that the responsiveness looks great until you get down to mobile size. At that point the left navigation or “story” pane disappears at some point – I’m trying to avoid it doing that with the aspect ratio that I’ve applied in the previous example.
Could this just be an issue with the ArcGIS (the content inside the iframe embed) system?
I hope that makes sense. If not, please feel free to ask questions.
And thank you so much for your help.
This is such an amazing community!
When I try to use this plugin I get the following issue:
Notice: Undefined index: basemap_toggle in /home/content/p3pnexwpnas11_data03/90/42158390/html/wp-content/plugins/embed-webmap/public/class-embed-webmap.php on line 161
Notice: Undefined index: home in /home/content/p3pnexwpnas11_data03/90/42158390/html/wp-content/plugins/embed-webmap/public/class-embed-webmap.php on line 172
Notice: Undefined index: basemaps in /home/content/p3pnexwpnas11_data03/90/42158390/html/wp-content/plugins/embed-webmap/public/class-embed-webmap.php on line 178
Notice: Undefined index: description in /home/content/p3pnexwpnas11_data03/90/42158390/html/wp-content/plugins/embed-webmap/public/class-embed-webmap.php on line 184
Notice: Undefined index: basemap_toggle in /home/content/p3pnexwpnas11_data03/90/42158390/html/wp-content/plugins/embed-webmap/public/class-embed-webmap.php on line 189
This content can’t be shown in a frame
There is supposed to be some content here, but the publisher doesn’t allow it to be displayed in a frame. This is to help protect the security of any information you might enter into this site.
Try this
Open this in a new window
The error code I get through the developer options is:
Refused to display ‘https://www.arcgis.com/home/signin.html?returnUrl=https%3A//www.arcgis.com/apps/Embed/index.html%3Fwebmap%3D8f6ac81be14b4f24bcda4dcc6d21a5e4%26extent%3D%26theme%3Dlight%26zoom%3Dfalse%26scale%3Dfalse%26disable_scroll%3Dfalse’ in a frame because it set ‘X-Frame-Options’ to ‘deny’.
Tried in Chrome and Edge. I have a webmap in a Public group and have only two layers:
– One I created
– One of ESRIs standard basemaps
Got any ideas what the issue is or where I can start troubleshooting?
]]>r-a-y on GitHub: https://github.com/gavinr/embed-webmap/pull/2
]]>https://julianka.com.ar/mi-mapa/
and in 4.7.2:
https://www.scanterra.com/wp/index.php/2017/02/15/mi-mapa/
but don’t work. I’ve some console’s errors TypeError: Cannot read property ‘baseMapLayers’ of undefined
Can you help me with this?
Thanks!
]]>We need to embed a arcGIS map, I have tried a couple of test ones, but get the following errors in my console.
TypeError: Cannot read property 'baseMapLayers' of undefined
at J (js.arcgis.com/3.19/init.js:2180)
at js.arcgis.com/3.19/init.js:2248
at c (js.arcgis.com/3.19/init.js:103)
at Object.z.then.then (js.arcgis.com/3.19/init.js:105)
at La (js.arcgis.com/3.19/init.js:2248)
at Object.createMap (js.arcgis.com/3.19/init.js:2253)
at Object._createWebMap (main.js:706)
at Object.<anonymous> (main.js:110)
at js.arcgis.com/3.19/init.js:63
at h (js.arcgis.com/3.19/init.js:107) "TypeError: Cannot read property 'baseMapLayers' of undefined
at J (https://js.arcgis.com/3.19/init.js:2180:221)
at https://js.arcgis.com/3.19/init.js:2248:370
at c (https://js.arcgis.com/3.19/init.js:103:393)
at Object.z.then.then (https://js.arcgis.com/3.19/init.js:105:463)
at La (https://js.arcgis.com/3.19/init.js:2248:347)
at Object.createMap (https://js.arcgis.com/3.19/init.js:2253:172)
at Object._createWebMap (https://www.arcgis.com/apps/Embed/js/main.js:706:26)
at Object.<anonymous> (https://www.arcgis.com/apps/Embed/js/main.js:110:26)
at https://js.arcgis.com/3.19/init.js:63:209
at h (https://js.arcgis.com/3.19/init.js:107:279)"Any ideas?
cheers
Steven
]]>