Map with markers
Search on map is a separate mode for the table component.
View an example of a map with points
How to configure the map
To display the map, you must do the following:
- Create a table with columns (all rows)
-
id-ID of the point (for possible operations with the point),
-
lat-longitude of the point,
-
lng - latitude of the point,
-
description - the description that appears in the window when the point marker is clicked,
-
tooltip-tooltip when hovering over a point,
-
radius - radius of the region.
- canDrag - if 1, points can be moved around the map and new values can be saved in the database (when moving, updateItemField is called with code=marker, id=point id and value = " lat|/lng")
-
Additionally, you can add the following columns (stylizing points and regions)
-
fillColor: '#a0bfeb',
-
fillOpacity: 0.2,
-
strokeColor: '#000000',
-
strokeOpacity: 1,
-
strokeWeight: 1
-
-
Write the GetItems request
-
MapShowUserLocation bit-show the user on the map?
-
MapUserImageUrl nvarchar(256) - path to the user's image.
-
MapShowAllRegions bit-show all locations serving all points
-
MapShowLocationInRange bit-show the location where the user gets to
-
-
SELECT 1 (with columns id int, lat nvarchar(32), lng nvarchar(32), description nvarchar(max), tooltip nvarchar(128), radius int)
-
in SELECT 3, set ViewType= 'map', add parameters in SELECT 3
Note:
-
The map will only work if you specified the Google API key in GetLayout (GeoLocationKey).
-
You can insert snippets of components (for example, a Form) in the marker description. Components are initialized by clicking on the marker.
- In General, moments with coordinates are passed in the lat||lng||text_address format (in UpdateField, lat||lng is passed)
If points can be moved, we also implement the UpdateField procedure
CREATE PROCEDURE [dbo].[crud_testMap_updateField]
@itemID int,
@field nvarchar(64),
@value nvarchar(max),
@username nvarchar(64)
AS
BEGIN
if(@field = 'marker') begin
declare @lat nvarchar(32), @lng nvarchar(32)
set @lat = [dbo].[str_splitPart](@value, '||', 1 )
set @lng = [dbo].[str_splitPart](@value, '||', 2 )
update tst_addresses
set lat = @lat, lng = @lng
where id = @itemID
end else begin
select 'Невалидный код свойства' Msg, 0 Result
return
end
select '' Msg, 1 Result
END
In SELECT 3, you can also pass the mapOptions parameter, which sets the map settings as JSON. Documentation on Google map tinctures - https://developers.google.com/maps/documentation/javascript/interaction
Configuration example:
-- 3 SELECT Advanced table settings
select 'map' ViewType,
0 MapShowUserLocation,
'' MapUserImageUrl,
0 MapShowAllRegions,
0 MapShowLocationInRange,
1 HideTitleCount, ' ' Title,
'{
"center":{"lat": 39.913818, "lng": 116.363625},
"zoom": 4,
"fitBound": false,
"afterMoveMarkerRefreshContainer": "body"
}' MapOptions
Custom settings (which are not related to the Google maps plugin).
- fitBound - if 1, the map will adapt the zoom and area to display all the selected points.
- afterMoveMarkerRefreshContainer-specify the content selector to update after moving the point (for example, to update a form or table on a page).
- mapCenter-sets the map center as {"lat": 12.34234, "lng": 43.2321}
Possible problems with the map
If a gray rectangle appears instead of the map and there are no errors in the console, it means that you need to set the zoom and mapCenter parameters. Example:
-- SELECT 3
SELECT '{
"zoom":9,
"mapCenter": {"lat":55.760533, "lng": 37.487028}
}' MapOptions
The alternative is to use fitBound=1 (in this case, the map (its center and zoom) will adapt to the points on it).
- Management
- Falcon Space Foundation
- Basic components
- Falcon Space Features
- Коммуникация с пользователем
- Дизайн, стилизация
- Integrations
- Каталоги
- Навигация
- Документы
- Additional component Falcon Space. Working with indicators Falcon Space. Panel-hints Falcon Space. The counters component Falcon Space. Business processes Falcon Space. Working with the catalog, shopping cart, and orders Working with HTML blocks Falcon Space. Working with trees (hierarchy) Universal likes, dislikes, ratings, voting for products Interactive tree Gantt Chart The Kanban Board Chartbar diagram Map with markers Cards Progress line Timeline Uploaded files Data output in the form of a graph on the site Output of the request movement by statusbar statuses
- Продвижение, SEO
- Системные моменты
- HOWTO
- HOWTO Tables
- HOWTO Forms
- Working with SQL
- HOWTO JS
- HOWTO Layout
- Solve problems
Falcon Space Platform
This is a reduction in the cost of ownership
at the expense of fewer people to support
This is a quick change
while using the program
This is a modern interface
full adaptation for mobile devices
- Falcon Space Video
- Platform features demo will allow you to understand how this or that component looks and works
- Have a question? Write to the chat at the bottom right