[shanna]

With major changes to Google maps API coming down the pipe on June 11 we are completely abandoning Google maps and moving to an alternative – something that many others are probably also considering.

It would be really nice if Connections had support for OpenStreetMap. We are evaluating using the mapsmarker.com plugin for maps outside of connections, as it supports OpenStreetMap. Maybe looking at their plugin would make development of an option like this a little easier for you.

[Steven Zahm]

@ shanna

The pricing changes I have long expected… ever since they started requiring an API for access. For now they are giving every user $200 free usage every month for Maps, Routes, or Places. Based on the pricing tables, this actually increases the amount free usage under the pricing / usage limits. Perhaps in time the amount of free usage will be reduced, but in the present those using it free now, will still be using free after June 11.

I am aware of Maps Marker Pro. They use the Leaflet library for OSM support. It does appear that library has matured quite a bit since I last reviewed it. If OSM mapping data is more mature/complete, it could be a viable replacement.

[Shanna]

Hi Steven, and thanks for your response on this.

While Google Maps Platform will apparently be free for the first $200 of usage, a lot of people (including me) are unhappy about having to provide a credit card to get that free usage. I’m unable to justify that to clients who only want a map on their contact page. It was already enough of a pain to set up API keys for clients, and the credit card requirement was the last straw that has caused us to abandon Google maps in favor of using leaflet.js and OSM tile servers.

I tried the Leaflet Maps Marker plugin but could not get it working, so wrote my own shortcode, which you can see here: https://autotechnik.ca/audi-service-ottawa/contact/

Our problem on https://columbiavalley.com is that we have a couple of essential plugins (events, directory) that embed Google maps and we’re looking for a way to substitute maps from another source.

Leaflet.js is really easy to work with and i’d be happy to give you my code if you are interested in making it an optional alternative to Google Maps in Connections.

[Steven Zahm]

@ shanna

Thanks for the additional feedback!

Sure, I’ll take a look at your code. Having a simple working example always helps! If you can post it on GitHub, that would be the best for me. A link to a zip file would work too.

Not sure how I would add support for both off the top of my head… but, I do the the value in it.

https://github.com/Connections-Business-Directory/Connections/issues/147

[Shanna]

Hi Steven,

Glad you are interested :)

What i have running now is part of something larger, but i need to make it into a single-purpose plugin just for the map shortcode. Once i’ve done that (expecting in a week or so) then i’ll give you that and you’ll be able to work with running code.

I’ll be back…

[Shanna]

This reply has been marked as private.

[Steven Zahm]

@ shanna

I’ve downloaded it. I’ll try to review it this week. Thanks!

[Shanna]

Good :)

We’d really love to see an alternative to Google in your plugin now that Google’s going in a new direction with maps.

[Steven Zahm]

@ shanna

Out of curiosity… how is using OSM going for you? The first step in in providing a multiple service geocoding API is landing in today’s update. Presently it supports Google Maps, Bing maps and OSM. This update does not provide any user facing changes. There’s much more work to do. In my testing I have found the OSM data to be very slow, if it has any at all for the address being queried. It may be free to use, but in my very limited testing I’m really uncertain how useful it’ll actually be to users. I was wondering what you experience has been.

[Steven Zahm]

@ shanna

Since we last emailed I have released a couple updates…

The first, I implemented multi-service provider geocoding support. When the Google Maps Server API key has not been setup, Connections will now default to a free geocoding provider, Algolia. They are basically a OSM provider.

The other, released today, extends this support to the maps being displayed. If the Google Maps Browser API has not been setup, Connections will now default to displaying maps from Wikimedia.

This update also include a new general purpose map shortcode. I’ve added this mostly so I can more easily test code as I develop it.

The basic options match the shortcode plugin you shared with me. Although the actual implementation differs greatly.

Basic usage:

[cn-mapblock]

This would simply display a map, centered in the US, zoomed in on a marker. The default will eventually be pulled from the Region/Country defined by the user on the Connections : Settings admin page under the General tab.

[cn-mapblock zoom=3 marker=no]

This will change the zoom so you can see the entire US and no marker.

[cn-mapblock latitude=40.3887 longitude=-78.6722 zoom=13]

This will create a map with a marker at a specific location with a marker.

[cn-mapblock latitude=40.3887 longitude=-78.6722 zoom=13]Marker popup content.[/cn-mapblock]

To add a popup to the marker, put the popup content between the opening and closing shortcode. It supports HTML :)

You can also add multiple markers to the map and set the map height, like so:

[cn-mapblock latitude=40.3356 longitude=-75.9269 zoom=13 height=600px]
<strong>Map</strong> pin!
[mapmarker latitude=40.3887 longitude=-78.6722/]
[mapmarker latitude=40.1098 longitude=-76.5033]<strong>Marker</strong> pin![/mapmarker}
[/cn-mapblock]

This will set a map marker with a popup and two additional markers, one with a popup, the other will be just a marker. To turn off the map level marker, add marker=no to the shortcode and remove the marker popup content, <strong>Map</strong> pin!. Like this:

[cn-mapblock latitude=40.3356 longitude=-75.9269 marker="no"]
[mapmarker latitude=40.3887 longitude=-78.6722/]
[mapmarker latitude=40.1098 longitude=-76.5033]<strong>Marker</strong> pin![/mapmarker}
[/cn-mapblock]

Now you’ll just two markers, one with a popup.

It can actually get crazier than this because the shortcode also supports multiple layers and adding markers to the individual layers. At that point, I think someone would be better off using a map builder plugin because that can get ugly looking real quick. This was added mostly for my testing.

You can also use the shortcode on the page more than once. But, due to the nature of nesting shortcodes and WP being “greedy” when parsing for them, you might have to self close a shortcode. Something you normally do not need to worry about. Here’s an example:

[cn-mapblock zoom=3 marker=no/]

Notice that slash in the shortcode… if you are nesting shortcodes and something is not working right, try self closing the shortcodes.

And one last thing… the maps lazy load! They will only load when the are within the window viewport. :)

Any way, that’s all. Hope you find this helpful!

[Author]

Posts