I am trying to make a full width google map. I set the width to 100% but is not working. Any help will be appreciated.
Printable View
I am trying to make a full width google map. I set the width to 100% but is not working. Any help will be appreciated.
Try setting the Placeholder/widget to Stretch Full Width: Utilities > Web Sticky/Stretchy
That's not workingQuote:
Originally Posted by Chris M
I thought this will be easy task for the experts here. But apparently is not.
I didn't know we had to be on the clock 24/7.Quote:
Originally Posted by Andre7
Acorn
You were 15 minutes late. I'm docking your pay accordingly. What's 25% of nothing?Quote:
Originally Posted by Acorn
you do know we don't get paid for this.. we just do it out of generosity, right?Quote:
Originally Posted by Andre7
and maybe, just maybe, we also have other things to do as well...
Of course I know you do it out of generosity and I am very grateful for the solutions you have provided for me so far. I didn't mean to be offensive. Just a bit frustrated as I spent two days on this.i apologise if it came out wrong.
I didn't mean it this way. Sorry. My bad!
Andre, you did not explain what you wanted to do with it so i have designed something that allows you to add any location and scaling in google Maps and then use its Share and Embed > Embed a Map option.
Copy this code into a Placeholder Body and change the width to 100% and the height to a large number. I chose 2048.
In Export options, I set Scale to fit width to 4096.
These options cover most browser scalings and widths.
The Placeholder has to be the bottommost object on MouseOff layer.
The Placeholder must not have Re-generate applied.
Attachment 134097
There are other approaches using the Google Maps API but you would need to have gaining an API Key.
The other method is to just use a static image and use CSS to make it cover the browser. Far more code but it then doesn't require an live Internet connection.
Acorn
Thank you Acorn. I just want full width map, not full screen. Something like a banner.
Just use Regenerate then or set the height to a smaller value.Quote:
Originally Posted by Andre7
Acorn
Open Google maps and go to wherever you want to go to.
Click the Hamburger (top left) and click Share or Embed Map.
Click Embed a Map tab and click Copy HTML
In Xara:
Create a rectangle
Utilities > Web Properties > Placeholder (tab) > HTML Code (body) and paste your code
Replace the sizes Google has in their code with 100%
Select the rectangle and Utilities > Web Sticky/Stretchy > Full Width (radio button)
Adjust height of the rectangle to suit your needs
>>> Attachment 134101 <<<
Thank you Chris, it is appreciated.Quote:
Originally Posted by Chris M
Acorn
Thank you Chris. I did this and it doesn't seem to work. The placeholder gets bigger but not fully stretched.Quote:
Originally Posted by Chris M
I don't know what I am doing wrong. I am sure I did this in the past, but can't remember how
Chris's example works straight out of the box and works as described.Quote:
Originally Posted by Andre7
To find out what is wrong with your attempt, you need to offer it up in a design file.
Acorn
Without Scale-to-fit-Width it works perfectly; apply StfW and I am not sure that it still works (at least it didn't for me)?
Gary, you are right but Chris was too having not specified anything about StFW.Quote:
Originally Posted by Initiostar
My Oslo Embed works in either configuration.
Acorn
Thanks for all your answers. My issue was with stFW. Without it works fine. Thanks again. All good now
Today I learnt a new thing.Quote:
Originally Posted by Initiostar
I did too Chris. Thanks @acorn. I too wanted the full width map. I saw it on some of the temps but was unsure how to actually do it.Quote:
Originally Posted by Chris M
-Bill