[Pro] Strange Behavior: Leaflet Action for Open Street Map

Freeway
1

This is an old website and today I went into it to change the address. All kinds of odd things are happening:

  • in the computer browser, there are multiple maps. On iPad & iPhone, only one map appears. I only need/want one map.

  • the multiple maps are overlapping and making a mess of things

  • As I said, this is an old site that relies on relative page layout. Perviously, I used “removed from relative page layout” to make things work, but it doesn’t seem to be working now.

  • I would like to be able to center my location on the map, but I can’t seem to figure out how.

Thanks FreeWayers! I couldn’t do this without you!

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

2

Oh, I just thought of something…

I did this site originally in FW 5.5. I’m now on FW 7.1. I converted the site over to FW7. I wonder if there is an incompatibility of some sort? I still have FW 5.5 and could try redoing all my changes in that, but would like to avoid it if possible.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

3

RPL does not work with Freeway 7. You can make a responsive layout in FW7, and Leaflet should work fine in that setting, since it is responsive by design.

Walter

On Oct 24, 2015, at 5:00 PM, Doty email@hidden wrote:

This is an old website and today I went into it to change the address. All kinds of odd things are happening:

  • in the computer browser, there are multiple maps. On iPad & iPhone, only one map appears. I only need/want one map.

  • the multiple maps are overlapping and making a mess of things

  • As I said, this is an old site that relies on relative page layout. Perviously, I used “removed from relative page layout” to make things work, but it doesn’t seem to be working now.

  • I would like to be able to center my location on the map, but I can’t seem to figure out how.

Thanks FreeWayers! I couldn’t do this without you!

http://flowersongherbals.com/contact.html

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

4

Thanks Walter. I remember reading that now, but I forgot. Since I’m just changing a couple of things and there is vertually no budget to speak of, I’ll just load my backup of FW5.5 as that will be much faster than creating a responsive layout. Hopefully soon, my client will have the budget for a redesign. For now, I just need to keep things working.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

5

Hi Doty

Your #Map div seems to have overflow:visible set when I change it in Safari the map behaves as expected, perhaps you can change this in your document.

996×992 302 KB

997×753 543 KB

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

6

Thanks all! Walt, isn’t there a way to center the map on my location? For some reason, the map is oriented on the upper right hand corner. I’d rather have the massage shop location be closer to the middle. Is this possible?

I think regressing back to FW 5.5 solved all the other issues I was seeing.

Thanks again.

Doty

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

7

You need to know the lat/long of the center to a reasonable precision, and enter it into the main Leaflet Action interface. Then you can create a marker with the marker Action (in the same bundle) to create the marker for your shop.

Walter

On Oct 25, 2015, at 4:27 PM, Doty email@hidden wrote:

Thanks all! Walt, isn’t there a way to center the map on my location? For some reason, the map is oriented on the upper right hand corner. I’d rather have the massage shop location be closer to the middle. Is this possible?

I think regressing back to FW 5.5 solved all the other issues I was seeing.

Thanks again.

Doty

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

8

Still having trouble. My client wants two identical maps. She wants one map on the Contact Page (this one looks the way it should). And there should be an identical map on the Massage Page . For this second map, I can’t get the marker text to show up. I’ve tried everything I can think of and the marker text is identical on both pages, as are the actions. Can someone lend a clue?

Thanks!

Doty

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

9

It looks like there is some sort of code mashup between the Target Show/Hide and Leaflet js on that page.

Try it without TS/H

D

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

10

Yep. You’re right, Dave. I removed it and [here you go.] (http://flowersongherbals.com/test.html) It’s even centered and I did it the same way as I tried on the contact page. (I don’t know the exact log/lat as Walt suggested above).

Now, is there any work around? I really want to keep those products on that page and a redesign is out of the budget. I tried the google maps action years ago and was fighting with it horribly, so I went with this open maps leaflet of Walt’s.

Doty

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

11

Oops! Made an error in my markdown.

here you go That is the link with show/hide target removed.

Thanks Dave!

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

12

I just wrote a big long screed about adding a Leaflet map without using the action (which will avoid the mash-up with TSH) but FWT ate it and I dont have time to rewrite it before I go out.

I’ll post again layer.

D

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

13

Thank you for your help, Dave. Much appreciated. Look forward to reading it.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

14

OK - here we go

1 - In Page Html Markup in the Before section add

<style type="text/css">
div#map2.leaflet-container.leaflet-fade-anim {font-size: inherit !important}
</style>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.2/leaflet.css">

2 - In Page Html Markup in the After section add

3 - In Page>Html Markup in the Before end add

<script type="text/javascript">
	var osm_map2 = L.map("map2").setView([37.312567,-107.8550055], 15);
	L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'}).addTo(osm_map2);
	L.marker([37.312567,-107.8550055]).addTo(osm_map2).bindPopup("Flowersong Herbals & Massage <br> 3750 Main Ave, Unit 1 <br> Durango Colorado 81301").openPopup();
</script>

Draw an empty html item on your page and make sure it has the name/ID of map2 (or change the references in the code you added) - size to suit your layout but make sure that Overflow is set to Hidden. You could probably just remove the leaflet action from the existing item.

Try it - making sure that you dont use the Leaflet action on that page.

D

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

15

Dave,

If I’m ever in Scotland I need to buy you a whole pub for the amount of beers I owe you!!!

Worked like a charm. Thank you.

freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options