Maps Made Easy:
Visualize Data in Your App with Jmix Maps

What is a map?

Map component displays geographical maps from various sources. It supports multiple layers, where different datasets are superimposed on top of one another to provide a multidimensional view of information that can be geographic, demographic, statistical, or otherwise. This allows for complex spatial analysis and decision-making.

How a map works?

A map layer refers to a visual representation of specific geographic information or data overlaid on a base map.

Each layer typically contains distinct sets of data, and multiple layers can be stacked or combined to create a comprehensive and informative map display. These layers can be toggled on or off, allowing users to control which information they want to view at any given time.

For example, one layer may show the geographical boundaries of districts, enabling a clear visual separation of regions on the map. Another layer is overlaid with data points representing customers, which can be toggled to display where clients are concentrated in those districts.

Base Map:

This is the foundational layer and serves as the geographic reference point for all the subsequent layers. It typically includes geographical features like roads, water bodies, and countries boundaries. It serves to provide context to the information displayed on top. The images for this layer are usually served over the web. Two of the most prevalent methods for retrieving images are:

XYZ tiles services:

This is a method where the map is divided into a grid of square tiles at various zoom levels. Each tile is a static image, typically a PNG or JPEG, that represents a specific geographic area at a particular level of detail. When you view a map on a web service, the tiles corresponding to your viewport and zoom level are loaded. As you pan or zoom in and out of the map, new tiles are requested from the server and loaded into the map to display the area you're interested in. This allows maps to be highly responsive and quick to navigate, as only the visible tiles need to be loaded rather than the entire map.

Web Map Service (WMS)

WMS is a standard protocol developed by the Open Geospatial Consortium for serving georeferenced map images over the internet. These images are generated by a map server using data from a GIS database. The key feature of WMS is that the images are created dynamically based on a user's request, which can specify not only the geographic area, zoom level, and image format but also which specific layers of data to include. This means that WMS can combine different data sources and layers to create a custom map that is sent to the user as a single image.

Overlay Layers

Overlay layers contain additional information overlaid on top of the base map. Layers can represent various types of data, including raster images or vector graphics. Vector layers consist of geometrical shapes (points, lines, polygons) defined by coordinates.

A point denotes precise locations, such as the address of a business, commonly represented by a location marker. Each point is identified by a pair of latitude and longitude coordinates.
Polylines consist of connected sequences of points that depict features such as roads or transportation networks.
Polygons are created by connecting lines to form enclosed shapes, depicting structures like building footprints or geographical boundaries such as state and national borders.

The way these layers work together is that they can be individually manipulated, turned on and off, or analyzed. For example, if one wanted to see where customers are located within a certain district, they could simply view those two layers together. This layered approach also allows for the analysis of spatial relationships and patterns, such as density of customers within districts, or how certain conditions might influence customer distribution.

Common Use Cases for Jmix Maps

Maps Use Cases

Incorporating maps into Jmix applications offers a dynamic way to represent spatial data, such as tracking sales regions, customer distribution patterns, or the locations of various branches. This kind of visualization provides several key benefits:

Enhanced Decision-Making:

By visualizing data such as sales territories, customer distribution, or branch locations, users can make informed, data-driven decisions, analyze trends, and understand geographical patterns more clearly.

Real-Time Monitoring and Logistics:

Maps enable the tracking of vehicles in real-time, crucial for shipment tracking, fleet management, and overcoming logistical hurdles. This feature is essential for efficient navigation and logistics planning.

Location-Based Services:

The integration of maps in applications powers location-based services, helping users find nearby points of interest like restaurants, hotels, gas stations, and other attractions, thereby enhancing user experience.

Asset Management and Tracking:

Maps facilitate the tracking and management of assets, including the location of infrastructure elements, IoT devices, and equipment, making it easier to oversee and coordinate these resources effectively.

Shapes Use Cases

Shapes on a map, including points, polylines, and polygons, have various applications across different industries and purposes. Here are some usage examples for each shape:

Points:

Markers for Locations: Displaying specific addresses, landmarks, or businesses on a map.
Points of Interest (POIs): Highlighting attractions, restaurants, hotels, or tourist spots.
Vehicle or Asset Tracking: Showing the real-time position of vehicles, assets, or deliveries.

Polylines:

Roads and Routes: Illustrating Road networks, highways, and directions between locations.
Trails and Paths: Displaying hiking trails, bike paths, or walking routes.
Flight Paths: Showing the trajectory of flights or air routes on a map.

Polygons:

Geographical Boundaries: Depicting country borders, state boundaries, or city limits.
Areas of Interest: Highlighting regions for sales territories, service coverage, or administrative districts.
Geofencing: Defining virtual perimeters for location-based alerts, such as in fleet management or geolocation-based apps.

Exploring Maps in an Onboarding Application:
A Practical Example

The Employee Onboarding application simplifies and automates the process of integrating new hires into the company.

During this process, employees select their primary work location from available options displayed using the map component, simplifying the selection of their base workplace.

The application features an interactive map showcasing offices and available coworking spaces. Different markers denote various location categories; for instance, green markers represent coworking spaces, while blue markers indicate offices.

Users interact with the map by clicking the "Select" button to choose a specific location. Upon selection, the map zooms in and centers around the chosen point, providing a detailed view.

Within the building's context, polygons are utilized to outline distinct areas, defining the boundaries of offices. Meanwhile, polylines depict routes from the office to the nearest bus stop. Furthermore, a point is employed to precisely mark the location of the entrance.