Google Maps in Drupal

Google Maps in Drupal

07 أبريل 2023

Drupal Google maps can be easily integrated into your website and help visitors find your physical address. This is an essential advantage in a competitive business environment because potential buyers will have to do one less action. This means the chance of a successful sale and visit to the store increases. We will tell you how to put google maps on the site and how custom drupal website development could help your business.

5 best modules to implement Drupal Google Maps

The first thing to do is to study the assortment of valuable and simple Google maps Drupal modules presented. Each of these will help make the final result on the site more attractive and functional. We recommend learning in detail about the available options, and at the end, we can collect together a small database that will help your users.

1. Address

The presented field is mandatory to save the address of a particular location. The advantage is that the Address module functions in any country in the world. Thanks to this, you do not have to simultaneously create several variants for all street names, cities, and indices.
In particular, users who need technical support in different countries will appreciate such a possibility. It is easy to configure everything because it is enough to select the elements that will be visible to all. You will also be able to use the validator to check the postal codes immediately in the package.
The module can also be customized by field if you use CSS coding or apply various templates of your own. You can also combine the address with other options.

2. Geolocation Field

Geolocation Field is a practical module for adding a particular field with latitude and longitude. This is the most specific feature, which includes 20 additional levels of the module itself. A simple option for just two elements in the form of coordinators will be extracted from the browser. Additionally, formatting tools display the location as a particular text—a very convenient feature of Drupal google maps API.
Thanks to the addition of the module, you can introduce some exciting chips on your site. For example, to show the distance in kilometers from the desired point. Determining the visitor's position on the site can be done simply by IP address, which your browser will provide. However, geolocation only opens its complete list of possibilities when all the additional modules are launched.
A key feature is the ability to work with the Open Leaflet library, which will allow you to manage the layers and work with commercial data providers. No add-ons and a chic setup. Works with Google Maps, Baidu, Here, and other projects.
In addition to this, there are many advantages:

  • work with static Google maps in the form of PNG;
  • support for geometric shapes on maps;
  • support for working with address, so you do not have to enter coordinates to determine the mailing address;
  • integration with the Geofield module.

The module's internals works perfectly and is well-polished, so it's easy to add the necessary functionality. And this is an advantage.

3. Geofield

For Google maps tools Drupal is presented in large numbers and, therefore, should not be discounted as another module Geofield. This is a kind of alternative to the Geolocation Field, which can offer you the following:

  • the ability to add the function of finding the current location of the user
  • widgets with coordinates, which are divided into different categories
  • WKT widgets
  • and much more

Other features are also available when integrating with Views. You can add fields and filters to calculate the distance to a certain point. In the basic version, however, there are only a few fields, but you can choose a suitable display format.
However, Geofield is only genuinely revealed with a particular map. You'll need to use the paid Google API to help you find locations, collect data, and use current widgets. You will also have access to a new map view display with pins.
The only drawback is the cost of using the API. However, it is a business expense and, therefore, can be considered a reasonable expense. Owners of sites with huge pages can also save extra money if they use one of the suggested methods.
You need to understand how many visitors to the site require the cards themselves. And if the need is not critical, you can use static maps in PNG. There is no interactivity, but the cost of using it is minimal. You can also add simple Google Maps without additional ways to customize and edit. Functionality is minimal, but you can use everything for free.

4. Leaflet

Another great alternative to Geofield Map was created on the Leaflet.js library. It also includes support for the OpenStreetMap site. It has many valuable features, including formatting with Solid Geofield to change the map and support different map display modes.
There is also a built-in library, Leaflet.markercluster, which will reduce the map's scale to group contacts and other data. It's also possible to implement support for form widgets. Advanced functionality will allow you to draw geometric shapes, add tasks, and enjoy all the extra benefits.
The essential advantage of the module is that you get a completely free solution at your disposal. This will help you close to customers' needs and provide a high level of service. In this critical Drupal module google maps Leaflet is one of the best options.

5. Geocoder

We also want to touch on the Geocoder module, which allows you to convert simple postal addresses into specific coordinates. This is a great way to extend the functionality of widgets and another format. With the program, you can use separate formatters, search for a location by a particular address, read addresses of any type, and enjoy all the benefits of modern software. 
We also recommend paying attention to AJAC Prepopulate for Geocoder, allowing you to edit coordinates directly in the content form. The built-in editor does not have the necessary functionality.

Simple Google Maps Drupal

Simple Google Maps is one of the best options if your product does not require extensive geolocation capabilities. Use a module with simplified controls and design that will allow you to provide users with a map. The reader will see a Google map with the address they need. You won't even need an API key. You won't be able to mark a position because it's useless.

An example of a simple location database

After getting acquainted with the various modules, you should apply what you have learned in practice. Especially for this, we have created a small database of locations, in which each entry should have its name, a short description, and an address with coordinates. The locations will be marked with pins on the map.
We will need several modules at once, including Address, Geofield, Geofield Map, Leaflet - including Leaflet Views and Leaflet Markercluster, Geocoder - including Geocoder Address, Geocoder Field.
This solution is a classic option for corporate sites. It is necessary to indicate the main points of interest for your employees or partners on a map.

Editing

The first thing to understand is that the biggest problem in your journey will be editing addresses. You want to be able to select any country. You will also need to search based on coordinates and vice versa to make working easier during content creation. In this case, we will use only free tools so that as many users as possible can adapt to our experience.
The first thing to do is to create a place content type and add two fields:

  • name field_address (don't forget to hide first name, last name, and company name in the settings at once);
  • field_coordinates with Geofield.

Next, create a link between the fields. You must fill them based on a simple map, even if the user did not enter his address. And vice versa, so that the place on the map is displayed by address after clicking on the button. You should do some magic with the fields: 

  • open the field_address settings, and in the special Geocode section, select reverse geocoding;
  • select coordinates from the list and click the button to skip geocoding if the value is empty;
  • note that free nomination should be selected;
  • enter field_coordinates settings to prefill by geocoding the existing code in the geocode section;
  • select an address from the general list of fields and click skip geocoding unless the value is empty. Nominatim remains the provider.

Creating a new location using latitude and longitude is not too convenient. Therefore, it is better to use a detailed map. You can do this in the Place settings by selecting the Geofield Map widget for the field_coordinates. You will be immediately warned about the absence of the Google API key, but you can ignore this.
Next, we can configure the site nomination at /admin/config/system/geocoder. We enter the root URL and don't forget to select pl in. Let's add a new location by filling in the address fields and clicking the button. If we are lucky, everything will work.

Display

Look at the home page. Check the home page. After that, it should work.

Views

The list of places is easy to display nodes with Place content. Choose Leaflet Map as the format. We add field_coordinates. In the format settings, select the first grouping to support content coordinates.
Let's save, add some test places and go to a specific address. We have a working interactive map with pins, adding additional points of interest 25-30 kilometers from our location. Editing will not cause problems.

Summary

To summarize, the geolocation topic in Drupal is vast, and we've touched the area only slightly. There are a lot of modules and features, each of which deserves a separate article for a few hours. That's why we recommend you try different variants on your project with us and achieve the necessary result. We wish you good luck!

Comments

An
مجهول