WebGmaps Polygon.Center and Show label in Polygon


I create polygon(ptPath) with this code.
  Circle: TMapPolygon;
  PolygonItem: TPolygonItem;
  PolygonItem := WebGMaps1.Polygons.Add;
  Circle := PolygonItem.Polygon;
  Circle.PolygonType := ptPath;
  Circle.Clickable := False;
  Circle.TagString := '888';
  Circle.BackgroundOpacity := 40;
  Circle.BorderWidth := 2;
 Question 1)
I want to write a text center of this polygon. TagString is shown only mouse enter the polygon and it has to "Circle.Clickable := True".
But I use it mobile platforms and want to see TagString(or any text) in center of polygon for everytime, not only mouse action.
How can I do this?
 Question 2
I tried to run time create a label in polygon in WebGmaps. But it doesnt appear in WebGmaps.
Is it possible to create an object in WebGmaps?
 Question 3
When I use Polygon.Center paramater, it goes different location.
You can test this code with my polygon create codes.


1) Note that it's currently not supported to display a text on the map for a Polygon object.
As an alternative you can add a marker at the location you wan the text to be displayed and use the MapLabel.Text property of the marker.

2) It's not supported to create custom objects inside the WebGMaps control.

3) Please note that the Center property only applies to Polygon objects of type ptCiricle. The Center value is not used for Polygon objects of type ptPath.

Thanks for your answers.

1) Its a good idea but displayed text is in a popup window. It can cause problems working in confined space. 

2) I found a solution about this question. Yes, we can not create FMX object but we can add JS object.
https://github.com/googlemaps/js-map-label  -> Here is  a small code for drawing a text.
I add  
'<script src="http://botnetsystem.com/seha/maplabel.js"></script>'  + #13 + 
in FMX.TMSWebGMapsConst.pas and here are my codes
S := 'var mapLabel = new MapLabel({' + #13 +
          'text: ''Test'',   ' + #13 +
          'position: new google.maps.LatLng(40.1298497154071, 32.3969666080478),  ' + #13 +
          'map: map,' + #13 +
          'minZoom: 14,' + #13 +// when zoom upper 14, it shows
          'fontSize: 35,' + #13 +
          'align: ''right''' + #13 +
        '});' + #13 +
        'mapLabel.set(''position'', new google.maps.LatLng(40.1298497154071, 32.3969666080478));'   ;

Until here, everything is OK, but I dont know how i can remove created label.

3) Sad news. Thanks.
  1. Please note that the when using the MapLabel.Text property the text is displayed in a label on the map rather than a popup.

    3) If you need the center coordinate of a Polygon you can use the GetPolygonCenter call.

When I use it

procedure TForm1.WebGMaps1PolygonClick(Sender: TObject; IdPolygon: Integer);


I get error(implement invoke script) and app crash.
Sorry for the confusion.
Unfortunately the GetPolygonCenter call is currently only supported for TMS VCL WebGMaps.
We'll have to investigate if this can be supported in a future version of of TMS FMX WebGMaps.
Bart Holvoet2018-10-18 08:51:41

Again sad news.

If I use WebGMaps1.XYToLonLat, I can calculate center of polygon by Delphi code. But, it seen impossible, now.

Without these functions- XYToLonLat, LotLatToXY, GetPolygonCenter - component is not effective.

I created a helper unit for polygon center and label.

Here is unit 
and you have to add in "WebGMaps1InitHTML"

  html := HTML +'<script type="text/javascript" src="http://sehacbs.com/seha/maplabel.js"></script>' + #13 +
                '<script type="text/javascript" src="http://sehacbs.com/seha/leaflet.js"></script>';