Custom Bitrix24 List Views: Map, Calendar, and Gantt Integration

Our company is engaged in the development, support and maintenance of Bitrix and Bitrix24 solutions of any complexity. From simple one-page sites to complex online stores, CRM systems with 1C and telephony integration. The experience of developers is confirmed by certificates from the vendor.
Showing 1 of 1All 1626 services
Custom Bitrix24 List Views: Map, Calendar, and Gantt Integration
Medium
~1-2 weeks
Frequently Asked Questions

Our competencies:

Development stages

Latest works

  • image_website-b2b-advance_0.webp
    B2B ADVANCE company website development
    1361
  • image_bitrix-bitrix-24-1c_fixper_448_0.webp
    Website development for FIXPER company
    949
  • image_bitrix-bitrix-24-1c_development_of_an_online_appointment_booking_widget_for_a_medical_center_594_0.webp
    Development based on Bitrix, Bitrix24, 1C for the company Development of an Online Appointment Booking Widget for a Medical Center
    695
  • image_bitrix-bitrix-24-1c_mirsanbel_458_0.webp
    Development based on 1C Enterprise for MIRSANBEL
    834
  • image_crm_dolbimby_434_0.webp
    Website development on CRM Bitrix24 for DOLBIMBY
    733
  • image_crm_technotorgcomplex_453_0.webp
    Development based on Bitrix24 for the company TECHNOTORGKOMPLEKS
    1076

Custom Bitrix24 List Views: Map, Calendar, and Gantt Integration

Standard Bitrix24 views—table and kanban—don't always display data in the needed dimension. For example, a sales manager with 5,000 deals needs to see them on a map for planning meetings. Or a project manager requires a Gantt chart for tasks with dependencies. Bitrix24 provides the placement mechanism for embedding custom interfaces, but implementation requires understanding of the Bitrix24 REST API, batch queries, and client-side caching. We will develop a custom view that solves your specific problem, considering data volumes and business logic.

Why Standard Views Don't Fit

Tables and kanbans are not optimized for geographic data, time scales, or complex dependencies. A deal map speeds up finding nearby clients, a calendar enables drag-and-drop for dates, and Gantt visualizes the project's critical path. In our practice, a project for a chain of car dealers: 3,000 active deals on a map grouped by cities. We used Leaflet with MarkerCluster, batch requests via BX24.callBatch loaded data in 4 seconds, geocoding via Yandex.Geocoder with caching. Result: managers save 2 hours per day, operational costs reduced by 40%. Payback for such implementation is less than six months. Batch requests are 50 times faster than sequential REST requests. Typical implementation cost starts at $3,000 and can be recovered within 6 months through efficiency gains.

How to Embed a Custom View via Placement

Placement is the primary method to integrate REST applications into the Bitrix24 interface. For CRM lists, the following points are available: CRM_DEAL_LIST_TOOLBAR, CRM_ANALYTICS_TOOLBAR, and separate sections via LEFT_MENU. The application loads in an iframe, authorizes via BX24.init(), and obtains context. Data is requested via REST: crm.deal.list, crm.item.list, tasks.task.list.

Three Typical Custom Views

Map. Deals with addresses are displayed as markers on Yandex.Maps or Leaflet. Click opens the card via BX24.openPath(). REST request with fields ID, TITLE, UF_CRM_ADDRESS, STAGE_ID, OPPORTUNITY. Geocoding is done on the backend with caching.

Calendar. Items with dates (deadlines, events) in monthly/weekly format. FullCalendar library integrates in 1-2 days. Drag-and-drop for changing dates triggers crm.deal.update.

Gantt Chart. Tasks with dependencies from DATE_START to DATE_END. DHTMLX Gantt (paid, full-featured) or Frappe Gantt (open source, basic). Data from tasks.task.list or smart process.

How to Solve the Large List Problem

The REST API limits output to 50 records per request. For hundreds or thousands of items, use pagination via batch requests:

Batch request code example
// Get total from the first request
BX24.callMethod('crm.deal.list', {
    select: ['ID', 'TITLE', 'UF_CRM_ADDRESS'],
    filter: {'STAGE_SEMANTIC_ID': 'P'}
}, function(result) {
    var total = result.total();
    var pages = Math.ceil(total / 50);

    // Form a batch of parallel requests
    var batch = {};
    for (var i = 0; i < pages; i++) {
        batch['page_' + i] = ['crm.deal.list', {
            select: ['ID', 'TITLE', 'UF_CRM_ADDRESS'],
            filter: {'STAGE_SEMANTIC_ID': 'P'},
            start: i * 50
        }];
    }
    BX24.callBatch(batch, renderAll);
});

Up to 50 commands in one batch; for 5,000+ items, process in sequential batches. In practice, 2,500 deals load in 3–5 seconds.

Filtering and Synchronization with the Main Filter

Two approaches:

  • Custom filter. Configuration inside the application – simpler, but the user sees two filters.
  • Context passing. Via BX24.placement.info() you get the base context. For full synchronization – a "Show on map" button in toolbar-placement reads the page's GET parameters (encoded filter) and applies them. Unified UX, but more complex.

Client-Side Caching

For frequently used views (territory map, project Gantt), we apply IndexedDB:

  1. First open – full data retrieval via REST, save to IndexedDB with timestamp.
  2. Subsequent – render from cache, background request for updates.
  3. Invalidation – by timer (every 5 minutes) or via WebSocket (BX24 Push).
// Pseudocode: check cache
if (cacheValid() && !forced) {
    renderFromCache();
} else {
    fetchDataAndCache();
}

Gantt Library Comparison

Feature comparison
Library License Features Integration Complexity
DHTMLX Gantt Paid Dependencies, critical paths, grouping Medium
Frappe Gantt Open Source Basic chart without dependencies Low

What's Included in the Work

  • Analysis of business processes and selection of the optimal view.
  • Development of a REST application with placement.
  • Integration of visualization library (Leaflet, FullCalendar, DHTMLX).
  • Implementation of batch loading and caching.
  • Testing on real volumes.
  • Documentation and user manual.
  • Warranty support after delivery.

Step-by-Step Implementation of a Custom Map

  1. Create a REST application with placement CRM_DEAL_LIST_TOOLBAR.
  2. Set up iframe and authorization via BX24.init().
  3. Retrieve data via crm.deal.list with batch (code above).
  4. Render markers with clustering.
  5. Implement caching in IndexedDB.
  6. Add synchronization with deal filter.

Effort Estimation

View Complexity Timeline
Table with custom columns Low 2–3 days
Calendar (FullCalendar) Medium 4–5 days
Map with markers and clustering Medium 5–7 days
Gantt chart with dependencies High 7–10 days
Dashboard with charts (Chart.js) Medium 4–6 days

The main risk is performance with large data volumes. We prototype on actual volume: if your CRM has 20,000 deals, the view must handle 20,000 deals. Contact us to evaluate your project – we'll choose the best solution and propose timelines. Get a consultation for your scenario. Over 5 years of experience, 50+ implemented views. For more details, refer to the Bitrix24 Placement Documentation.

1C-Bitrix Module Development and Setup

The main trap of Bitrix is init.php. You add an OnBeforeIBlockElementUpdate handler there, then another one — a year later the file is 2000 lines, and on every hit all that code executes. We move business logic into full-fledged modules with D7 ORM, custom tables, and administrative interface. The module can be disabled, transferred to another project, covered with tests — none of that is possible with init.php. Our team has 10+ years of Bitrix experience, certified specialists, and a 6-month code guarantee. Request a consultation — we'll explain how to migrate legacy code to a modular architecture.

Why is init.php the worst place for business logic?

Init.php does not support class autoloading, lacks an isolated namespace, cannot be unit tested, and cannot be disabled without editing the file itself. Every handler written there runs on every request, even if not needed. In a module, you register handlers through EventManager, and they only execute when the event occurs. Performance difference: up to 3x with 10+ handlers.

Standard Modules: Typical Problems and Solutions

Information blocks. IBlock architecture is the first thing we review on any project. A classic mistake: one catalog infoblock with 80 properties, 30 of which are multiple. The b_iblock_element_property table swells to millions of rows, and CIBlockElement::GetList with filtering on three properties does a full scan. We move reference data to Highload-blocks, eliminate multiple properties where possible, and design the structure for 5x growth.

e-Store (sale). Cart business rules are a separate story. We set discount priorities to prevent two campaigns from giving 60% instead of 30%, connect payment handlers, and write custom validation via OnSaleOrderBeforeSaved.

Search. The built-in search module with morphology works up to 10–15 thousand elements. Beyond that — Elasticsearch. We configure it via the Bitrix search module API, indexing through CSearchFullText or custom indexers.

Highload-blocks for dictionaries, logs, user data — instead of bloated IBlocks. Direct queries via Bitrix\Highloadblock\HighloadBlockTable, custom tables instead of the EAV structure of standard infoblocks. A million records — no degradation.

Mail events. Configuration is not just templates in b_event_message. The key is SPF, DKIM, DMARC on the DNS, otherwise transactional emails go to spam. We check deliverability and set up bounce handling.

How to Design Infoblocks for Performance?

We use Highload-blocks for reference data (colors, sizes, manufacturers) that are not involved in complex queries. For SKUs — a separate infoblock with linking via IBLOCK_ELEMENT_PROPERTY. Enable INDEX_PROPERTY for frequently filtered properties. Tagged caching: when an element changes, only the related cache is cleared. Highload-blocks process up to 10x faster than infoblocks with multiple properties on volumes of 100,000 records.

Custom Module Development

Each module follows the structure /local/modules/vendor.modulename/:

  • install/index.php — setup class, create tables via $DB->RunSQLBatch()
  • lib/ — D7 ORM classes, extending Bitrix\Main\ORM\Data\DataManager
  • admin/ — administrative pages using CAdminList, CAdminForm
  • include.php — autoloading, event handler registration via EventManager::getInstance()->registerEventHandler()
  • REST API endpoints via \Bitrix\Rest\RestManager

The module registers in the system, appears in the "Installed Solutions" list, and has its own settings at /bitrix/admin/settings.php?mid=vendor.modulename. It can be enabled, disabled, and updated through UpdateSystem or custom migration mechanics.

Examples of implemented tasks:

  • Campaign management — visual condition builder via CAdminCalendar, timers via agents (CAgent::AddAgent), analytics linked to the sale module
  • Cost calculator — React widget on the frontend, REST API in the module, formulas stored in a Highload-block
  • Booking system — real-time calendar, locking via $DB->StartTransaction() / $DB->Commit() on concurrent requests, integration with channel manager via webhook

Components and Composite Cache

Component customization via result_modifier.php and component_epilog.php, not by editing template.php of the standard template. This way core updates are painless.

Composite cache ("Composite Site" technology) — the server sends ready HTML, bypassing PHP routing. Dynamic areas (cart, authorization) are loaded via CBitrixComponent::setFrameMode(true) and AJAX. TTFB drops to 30–50 ms. But there are caveats: not all components are compatible, $APPLICATION->ShowPanel() breaks composite, and careful markup of <div id="bx-composite-..."> is required.

What to Check Before Installing a Marketplace Module?

Before installing a module from the marketplace, an audit is mandatory. We check: SQL queries without prepared statements (hello SQL injection), direct use of $_REQUEST without filtering, use of outdated kernel API instead of D7, conflicts with the composite cache module. A module with no updates for over a year and a few dozen installations is likely a problem on the next PHP update. A typical case: a module calls CIBlockElement::GetList with no cache reset — the site crashes with 5000 elements.

Migration to D7

When upgrading PHP or switching to a new edition — refactor outdated calls:

  • CIBlockElement::GetList()Bitrix\Iblock\Elements\ElementTable::getList()
  • CSaleOrder::GetList()Bitrix\Sale\Order::getList()
  • CModule::IncludeModule()Bitrix\Main\Loader::includeModule() Testing on staging, rollback via git on issues.

According to official 1C-Bitrix documentation, D7 ORM is the recommended tool for working with data, providing type safety and automatic query generation.

Comparison: Init.php vs Module

Criterion Init.php Module with D7 ORM
Performance Executes on every hit Executes only on event
Testability No autoloading, tests impossible Full PHPUnit support
Maintainability Codebase grows uncontrollably Isolated structure, versioning
Migrations None Custom tables, managed via install
Caching Does not support auto-invalidation Tagged caching, event-based clearing

Module Development Scope and Cost

What is included in module development?

  • Technical specification and architectural plan
  • Code following PSR-4 and Bitrix code style
  • Unit tests (PHPUnit) for business logic
  • Integration tests for events and REST API
  • Installation, configuration, and API documentation
  • Repository and documentation access
  • Administrator training for module usage
  • 6-month warranty support

Estimated timelines and complexity:

Complexity Examples Timeline
Simple Callback widget, banner system, simple calculator 3–5 days
Medium Booking system, product configurator, review module with moderation 1–2 weeks
Complex Multi-regionality, custom loyalty program, ERP integration 2–4 weeks
Enterprise Marketplace platform, complex business processes with multiple roles 1–3 months

Cost is calculated individually — contact us for a project estimate.

Module Testing

Unit tests via PHPUnit cover business logic: discount calculation, validation, document generation. Mocks for Bitrix\Main\Application::getConnection() allow tests to be DB-independent. Integration tests verify event handlers on a real database — OnAfterIBlockElementAdd, OnSaleOrderSaved, etc. REST API endpoints are tested via curl or PHPUnit HTTP client. Critical for modules working with b_sale_order, b_catalog_price — where errors cost money.

Compatibility is checked on PHP 7.4, 8.0, 8.1, 8.2 and editions: Standard, Small Business, Business. We check conflicts with popular marketplace modules — they often intercept the same events. Load testing: measurements on 10K, 100K, 1M records, profiling via Xdebug for memory leaks and N+1 queries.

Practical Examples

Campaign module for an electronics chain. The built-in sale module discounts did not cover scenarios like "2+1", a gift with purchase over a certain amount, or combined conditions. We built a visual builder: marketers create rules via drag-and-drop without development tickets. Campaign calendar, auto-deactivation via agents, analytics linked to b_sale_order — conversion, average check, usage count. Time to launch a new campaign dropped from two days to half an hour.

Calculator for builders. Parameters (area, materials, number of floors) → formula → preliminary estimate → lead to CRM via CRest::call('crm.lead.add'). Regional coefficients and seasonal markups from a Highload-block, material prices from 1C exchange. The number of target leads increased by a third: clients see a breakdown before calling a manager.

Booking for a hotel chain. Real-time availability via AJAX requests to a custom table vendor_booking_slots, seasonal tariff calculation, synchronization with Booking.com via channel manager API. Room locking on concurrent booking via SELECT ... FOR UPDATE in transactions. Timezones handled via \DateTimeZone — a guest from Vladivostok and a manager from Moscow see the same picture.

We will evaluate your project within one day. Write to us — we'll tell you what is included in turnkey development. Contact us for a consultation on your project. Order a custom module development — get a ready solution with documentation and support.