TTMSFMXWebGMaps Clusters

FMX TMS FMX WebGMaps
1
When using the following code I only see markers, not clusters.

Any help would be greatly appreciated.Unfortunately there is no demo for Clusters in the TTMSFMXWebGMaps demos and the VCL one crashes.

GMap.Clusters.Clear;
GMap.DeleteAllMapCluster;
GMap.MapPanTo(GMap.MapOptions.DefaultLatitude,GMap.MapOptions.DefaultLongitude);
GMap.MapOptions.ZoomMap:=2;
if not Query.IsEmpty then
begin
  while not Query.EOF do
  begin
    if LastCountry<>Query.FieldByName('Country').AsString then
    begin
      GMap.Clusters.Add;
      GMap.Clusters[GMap.Clusters.Count-1].Cluster.MinimumClusterSize:=1;
      GMap.Clusters[GMap.Clusters.Count-1].Cluster.Title:=Query.FieldByName('Country').AsString;
      LastCountry:=Query.FieldByName('Country').AsString;
    end;
    Marker:=GMap.Markers.Add;
    Marker.Latitude:=Query.FieldByName('Latitude').AsFloat;
    Marker.Longitude:=Query.FieldByName('Longitude').AsFloat;
    Marker.Cluster:=GMap.Clusters[GMap.Clusters.Count-1].Cluster;
    Query.Next;
  end;
end;
 for I:=0 to GMap.Clusters.Count-1 do
    GMap.CreateMapCluster(GMap.Clusters.Cluster);
2

Hi,


- We are not aware of any issues with the MarkerClusterDemo in VCL. Can you please make sure you assigned an API Key for both TWebGMaps and TWebGMapsGeocoding?

- Please note that this line "Marker:=GMap.Markers.Add;" shouldn't automatically add Markers to the map so you need to add the line "GMap.CreateMapMarker(Marker);" as well.
With this change your code is working as expected when tested here.

Example:
    Marker:=GMap.Markers.Add;
    Marker.Latitude:=GMap.MapOptions.DefaultLatitude;
    Marker.Longitude:=GMap.MapOptions.DefaultLongitude;
    Marker.Cluster:=GMap.Clusters[0].Cluster;
    GMap.CreateMapMarker(Marker);

3
Thanks. It was the GMap.CreateMapMarker(Marker) that cured my problem thanks. There is no problem with theVCL demo, I had just not assigned my API key to both controls.

I want to assign a value to the Cluster tag property, and then use that as displayed total on the Cluster. Can you please tell me how to do that?
4

Thank you for confirming the previous issue was resolved.

Please note that it's unfortunately currently not supported to change the value that is displayed in the cluster icon.

5

Thanks but the documentation mentions using the Calculator and javascripto to do this.

6

Although there is no built-in way to change the Cluster value in TTMSFMXWebGMaps, the Calculator property indeed provides a way to change the Cluster value by using JavaScript.


Note that in JavaScript only the JS Cluster object is available, the Delphi Cluster.Tag property value is not part of this object.
7

Thanks. Could you please give me an example?

8

Except the example provided in the PDF manual there are currently no other examples available.

9
I'm obviously doing something wrong as if I just add the function as specified in the documentation without any change, I get markers displayed instead of clusters. Any help would be grealy appreciated.

  C.Calculator.Add('function(markers, numStyles) { ');
  C.Calculator.Add('var index = 0; ');
  C.Calculator.Add('var title = ""; ');
  C.Calculator.Add('var count = markers.length; ');
  C.Calculator.Add('var dv = count; ');
  C.Calculator.Add('while (dv !== 0) { dv = parseInt(dv / 10, 10); index++; } ');
  C.Calculator.Add('index = Math.min(index, numStyles); ');
  C.Calculator.Add('return { text: count, index: index, title: title }; };');

10

Sorry but I really need some help with this!

11

We are investigating this issue and will report back as soon as possible.

12

The example contains redundant semicolons which are the cause of the issue.
Please change the last line to:

  C.Calculator.Add('return { text: count, index: index, title: title } }');

Apologies for the confusion. This will be corrected in the manual as well.


Bart Holvoet2020-03-11 11:26:12

13

Many thanks. That now works. How can I now access each applicable marker to add up the tag values?

14

You can access the properties for each marker through the markers parameter, but note that the Tag property is not accessible in JavaScript.

Example:
markers[0].title

15

What about using the Data property. Does it have access to that?

16

The Data property also is not accessible.
Note that in JavaScript there is only access to the Google Maps Marker object which is different from the Delphi Marker object.

17

Can you please tell me where the Google Maps Marker object is defined/populated?

18

This is done in the createMapMarker JavaScript function that is located in UWebGMapsConst.pas.

19

That doesn't seem to help me much. Can you suggest a way that I might be able to do this? I need to assign a value to each marker and when a cluster is displayed add up all of the marker values and display that.

20

Without making changes to the source code I can only suggest the following:
If you don't mind the value appearing on the marker as well you could use the Merker.Title or Marker.Text properties which correspond with markers[].title and markers[].text respectively in the JS markers object.