Meta Box Weekly Updates: v4.15.0 with OpenStreetMap

Today, we've just released a new minor update for Meta Box - version 4.15.0. This version includes a new osm field type for OpenStreetMap, along with some improvements for performance. Let's see what's new below.

New field type for OpenStreetMap

Why new map field? Is Google Maps not good enough?

As you might know, since June 11th 2018, Google has forced developers to enter credit card details in order to use the Google Maps service. Without enabling billing with a credit card, you can't use all the Google Maps platform anymore.

Previously, Google offered free plan for developers, which include maximum 25.000 requests per day. And with the current change, Google still offers a free plan, but it's not based on the number of requests. Instead, based on free credit of $200. If you use more than $200, your card will be charged.

What's the problem then?

Well, if you develop websites for clients that uses a Google map, then you have to ask them to give you credit card details or they have to setup a project on Google Maps platform themselves. I have to say that setting up a project on Google Maps platform is not for beginners or non-technical people. Or you can just use your credit card. Not happy in both cases.

What about websites that are already running for a long time? And one day, the map on the contact page suddenly doesn't show up?

For more details, take a look at the long discussion in our support forum.

Entering OpenStreetMap

While looking for an alternative, OpenStreetMap is obviously the best choice. There are other alternatives such as Bing Map, but they're not open source and popular. And as David said in the forum topic:

Here is a screenshot of OpenStreetMap field in Meta Box:

OpenStreetMap field type

After deciding to create a new field type for OpenStreetMap, we decided to use the Leaflet library. It's the most popular JavaScript library for rendering maps. It supports Google Maps and, of course, OpenStreetMap.

And to make developers' lives easier, we tried to keep the same settings as the Google Maps field, which includes:

Autocomplete

The autocomplete feature uses Nominatim service for geocoding. It's the service that powers the OpenStreetMap homepage. Nominatim works well in most cases, but I have to admit that the result is not as good as Google Maps.

Nominatim is free, but have some usage limitation. We cannot use it for heavy website which has more than 1 request per second.

Address field

In order to keep the autocomplete work, the OpenStreetMap needs an address field. When you select an address, the map and the marker automatically move to the new location. You can still drag the marker to a correct location if needed.

Note that you still can use the map without an address field. It's not mandatory. In this case, you just don't have the autocomplete feature.

Language and region

Both language and region settings are available in OpenStreetMap field. They're used to provide better results for autocomplete.

There is a difference between Google Maps field and OpenStreetMap field. The language in Google Maps is used for the map language. In OpenStreetMap, the map always show the correct language for the being viewed country. For example, if you look at United States, you'll see all labels in English. If you look at Russia, you'll see all labels in Russian.

The language in OpenStreetMap is used for autocomplete feature to provide more accurate results. For example: searching for a same term "ha" in English and Vietnamese gives different results.

Start using OpenStreetMap now

So, you can use the OpenStreetMap in the place of Google Maps, or use both of them. We have prepared a demo file that you can "copy and paste". Documentation for the new field is also available.

Performance Improvement

Another huge improvement is the update on object fields (user, post, taxonomy, taxonomy_advanced). Previously, if you have a cloneable post field and you have 10 clones for the field, then the plugin will perform 10 queries to get posts for each clone. This causes a big problem if you have a lot of posts.

In the version 4.15.0, the code that queries and renders the clones is optimized. No matter how many clones you have, there's only one query. That makes your edit post load faster and there's no heavy load on your database.

Other New Features

Version 4.15.0 also added some interesting features, requested by our beloved users:

• Added new boolean save_field setting for fields, which allows developers to disable the fields from saving to the database. They should handle the "save" action themselves.
• Added new boolean closed parameter for meta box that collapses meta box on page load.

Field oembed also gets some updates to better display on the frontend in case there's no embed media. Developers can:

• Change the "not available message" with the new field setting not_available_string. That works per field.
• Or they can filter the message for all oembed field with the new filter rwmb_not_available_string.
• Or they can hide the message with CSS. The message is wrapped in a div with class rwmb-oembed-not-available.

Extensions Update

There are also some updates for premium extensions this week.

• Meta Box Tabs: improves style for mobile devices.
• Meta Box Include Exclude is compatible with MB Frontend Submission. You can use Meta Box Include Exclude to show/hide meta boxes based on post ID, template or user roles.
• Meta Box Builder also got some updates that fixed the missing support for MB Custom Table and field_type for post field.

That's all for now! We hope you like the updates and if you find any bug, please let us know in the support forum or on Github. Don't forget to join our Facebook group if you haven't. The answers there might be faster than in the support forum sometimes!