Marker Labels

FMX TMS FMX WebGMaps
1

Adding a label to a map Marker gives a strange display.  I want to add a simple text character as per the google demo at https://developers.google.com/maps/documentation/javascript/examples/marker-labels

The google code shows the character nicely placed on top of the map marker.
Using
the label property of TMarker adds the marker in a bordered box with a 
white background and it is offset from the map Marker. - very ugly.

Here's my code to create the marker (reading the lat/long from a dataset):


class function TMapUtils.CreateMarker(DataSet: TDataSet; Markers: TMarkers; Flat: Boolean = true): TMarker;
begin
// create marker using TMS code
  Result := Markers.Add(DataSet.FieldByName('lat').AsFloat, DataSet.FieldByName('long').AsFloat,
    DataSet.FieldByName('Address1').AsString, '', false, true, true, Flat, false, -1, TMarkerIconColor.icGreen);

  Result.Title := DataSet.FieldByName('address1').AsString;
  Result.Data := '{"siteid":' + DataSet.FieldByName('siteId').AsString + '}';

  Result.MapLabel.Text := 'B';

 //NB: hack for proof of concept - elevated private field in TMarkers to protected to get this working
// versus create marker using  javascript - offset a little so we can see the difference
  (TMarkersAccess(Markers).FWebGMaps as TTMSFMXWebGMaps)
   
 .ExecJScript('var marker = new google.maps.Marker({' + 'position:   { 
lat:' + FloatToStr(DataSet.FieldByName('lat').AsFloat +
    0.01) + 
', lng: ' + FloatToStr(DataSet.FieldByName('long').AsFloat + 0.01) + ' 
}, ' + 'label: "B", ' + 'map: map  ' + '}); '  );
end;



The forum doesn't support images but I'm happy to email an example through.

2

Hi,


- Please note that the internal marker label character is only supported when the IconColor is set to icDefault.
This is a limitation of the Google Maps API.

Example:
  WebGMaps1.Markers.Add(WebGMaps1.MapOptions.DefaultLatitude, WebGMaps1.MapOptions.DefaultLongitude);
  WebGMaps1.Markers[0].Text := 'B';

- The MapLabel.Text which you are using in your sample code will display a label outside the Marker which can fit more text.
The label colors are configurable.