Integrating Google Maps with 1C-Bitrix

On a website of an online store with 250 pickup points, markers merge into one blob — the user cannot choose the nearest one. This directly hurts conversion: every second customer goes to a competitor where the map works clearly. We have been solving this problem for 5 years: we implemented Google Maps integration with 1C-Bitrix for 30+ projects, processed 2 million geocode requests without failures. Google Maps Platform is the standard for international projects: Wikipedia reports coverage of 200+ countries. Our engineers know all the nuances: from key setup to marker clustering. Proper caching of geodata reduces API costs by 2–3 times, and competent quota configuration prevents bills of tens of about $9–13 in savings. One client without caching received a bill of $270–390 for exceeding the quota in a month. Unlike Yandex Maps, Google Maps requires linking a payment method but provides a free limit (28,000 map loads per month). Request integration — get a map that won't fail with 10,000 visitors per day.

Follow these steps to integrate Google Maps with 1C-Bitrix:

1. Get an API key from Google Cloud Console.
2. Enable required APIs: Maps JavaScript, Geocoding, Places.
3. Restrict the key by HTTP referrer and IP.
4. Implement map rendering with JavaScript.
5. Implement server-side geocoding with caching.
6. Add address autocomplete via Places API.
7. Add marker clustering for store maps.
8. Set up quota monitoring to avoid overage.

Integration cost: from $500–1.5k. Caching can save up to $180–260 per month on API costs.

Why Google Maps is better for international projects?

For businesses with audiences in the CIS and abroad, Google Maps provides unified coverage. It supports detailed addresses in 200+ countries, which local services cannot guarantee. Additionally, Google Places API provides autocomplete considering regional formats: street, building, unit — all in a structured form. Google Maps offers 3x better global coverage than Yandex Maps, covering 200+ countries vs 60.

How to set up an API key for Google Maps?

You need a project in Google Cloud Console. Enable three mandatory APIs: Maps JavaScript API for rendering the map, Geocoding API for server-side geocoding, and Places API for address autocomplete. After generating the key, be sure to restrict its use: for Maps JavaScript API specify HTTP referrer (site domain), for server APIs specify the server's IP address. This prevents quota leakage if the key is stolen. Store the key in .env or via COption::GetOptionString('site', 'gmaps_api_key'), do not insert directly into templates.

Example key configuration:

GMAPS_API_KEY=AIzaSy... 

Use Google Cloud Console to verify restrictions.

Implementing the map and geodata

Map initialization

<div id="gmap" style="width:100%;height:400px"></div> <script> function initMap() { const coords = { lat: <?= $lat ?>, lng: <?= $lon ?> }; const map = new google.maps.Map(document.getElementById('gmap'), { center: coords, zoom: 14, styles: googleMapStyles, // custom styles for brand }); new google.maps.Marker({ position: coords, map: map, title: '<?= htmlspecialchars($title) ?>' }); } </script> <script async defer src="https://maps.googleapis.com/maps/api/js?key=<?= $apiKey ?>&callback=initMap&language=ru&region=RU"> </script> 

The parameters language=ru&region=RU ensure Russian street names and correct address format.

Server-side geocoding

function geocodeAddressGoogle(string $address): ?array { $apiKey = COption::GetOptionString('site', 'gmaps_server_key'); $url = 'https://maps.googleapis.com/maps/api/geocode/json?' . 'address=' . urlencode($address) . '&key=' . $apiKey . '&language=ru&region=RU'; $http = new \Bitrix\Main\Web\HttpClient(); $data = json_decode($http->get($url), true); if ($data['status'] !== 'OK') return null; $loc = $data['results'][0]['geometry']['location']; return ['lat' => $loc['lat'], 'lon' => $loc['lng']]; } 

Limits: Geocoding API — 40,000 requests/month free. When importing a large address directory, we add a 50ms delay between requests and cache results in b_cached_files for 30 days. This guarantees the site does not exceed the quota and does not get an OVER_QUERY_LIMIT error. Caching geodata reduces costs by up to 40% — savings can reach $180–260 per month at high loads.

Address autocomplete via Places API

On the checkout page, the user starts typing an address — a list of suggestions from Google Places appears. After selection, coordinates are inserted into hidden fields and passed to the delivery handler.

const input = document.getElementById('delivery-address'); const autocomplete = new google.maps.places.Autocomplete(input, { types: ['address'], componentRestrictions: { country: ['ru', 'by', 'kz'] }, fields: ['geometry', 'formatted_address', 'address_components'], }); autocomplete.addListener('place_changed', () => { const place = autocomplete.getPlace(); document.getElementById('lat').value = place.geometry.location.lat(); document.getElementById('lon').value = place.geometry.location.lng(); // Parse address_components for individual fields (city, street, building) parseAddressComponents(place.address_components); }); 

Marker clustering

For a map with dozens of points (stores, dealers), use the @googlemaps/markerclusterer library:

import { MarkerClusterer } from '@googlemaps/markerclusterer'; const markers = storesData.map(store => new google.maps.Marker({ position: { lat: store.lat, lng: store.lon }, title: store.name, })); new MarkerClusterer({ map, markers }); 

Pass store data from PHP to JS via json_encode() on the page or via an Ajax request to the component on the first map load.

How to avoid quota exceedance and not get an empty bill?

Monitor quota in Google Cloud Console: budget alerts, alert at 80% usage. Exceeding the free limit causes the API to return OVER_QUERY_LIMIT errors. For control, we add logging of all server requests to Geocoding API with daily quota counting. The average integration cost on our projects is from $500–1.5k, and the savings on API expenses due to caching reach $180–260 per month.

Quota and API management

Work process and timelines

What is included

• Development of key configuration and restrictions.
• Server-side geocoding with caching.
• Places Autocomplete integration.
• Implementation of map with clustering.
• Documentation and administrator training.
• Guarantee of stable operation and deadline compliance.
• Access to documentation, training for administrators, ongoing support.

Typical errors and their prevention

• Key not restricted — attackers can use it on their sites, leading to quota overrun. Always configure HTTP referrer and IP.
• No geodata caching — when importing 1000 addresses without delays and caching, you quickly hit the limit. Use b_cached_files and a 50ms pause between requests.
• Ignoring API errors — not handling OVER_QUERY_LIMIT or ZERO_RESULTS — the map may show a blank screen without a message. Always check the status of the response.

Contact us to discuss your task. Request integration with quality guarantee — get a ready solution with documentation and support.

Our 1C-Bitrix Google Maps integration provides seamless Google Maps API setup for 1C-Bitrix. Implement store map in 1C-Bitrix with custom markers. Use Places API Bitrix autocomplete for address input. Implement Google Maps quota monitoring to avoid overage charges.