图文解说ChinaCock高德地图组件为标注设置浮动标签显示 (三)

继续前文，我们实现了，让用户直接在地图上设置标注，然后取得标注点的经纬度及详细地址，实现用户采集指定企业的地址信息。

在实际需求中，用户还想鼠标经过标注时，能显示单位在名称，离开时自动隐藏，如下图：

看一下具体的实现：

1.建立标签对象

在地图初始化时，我们为地图建一个签标对象，下面这段代码在FormCreate事件实现，初始化地图对象时建立一标签对象，同Marker类似，地图对象有Texts属性，可以管理N多个标签对象。

  // 建立一个Text对象,显示标注名称
  var
  AText := self.CCuniGUIAMap1.Texts.Add;
  with AText do
  begin
    with Options do
    begin
      // 指定鼠标悬停时的鼠标样式。
      Anchor := 'center';
      cursor := 'pointer';
      Options.Offset.Y := -48;
      // 设置文本样式，Object同css样式表，如:{'background-color':'red'}
      Style := '{'
        + '"border-radius":".25rem"'
        + ',"background-color": "white"'
        + ',"border-width": 0'
        + ',"box-shadow":"0 2px 6px 0 rgba(0, 0, 0, .5)"'
        + ',"text-align":"center"'
        + ',"font-size":"10px"'
        + ',"color": "#FF0000"'
        + '}';
    end;
  end;

2.准备标签内容

在Marker对象上保存企业名称，Marker对象有CustomParams属性，可以保存任意的值进去，代码如下，在地图上建立一个Marker对象时，直接保存要显示的企业名称。

      myMarker.CustomParams.Values['CorpName'] := self.CorpName;

3.自动为标注显示标签

这需要在进入Marker时显示名称。正好，地图对象为我们提供了MarkerMouseOver事件，鼠标移到标注上时触发，在这个事件中显示标签：

procedure TGaoDeMapForm.CCuniGUIAMap1MarkerMouseOver(const ASender: TObject;
  const AMarker: TCCuniGUIAMap.TMarker; const ALngLat: TLngLat;
const AEventParams: TUniStrings);
begin
  var
  AText := self.CCuniGUIAMap1.Texts.Items[0];//取出Text对象

  AText.Show; // 必须先执行才显示正常

  AText.SetPosition(AMarker.Options.Position);//设置显示位置
  AText.SetText(AMarker.CustomParams.Values['CorpName']);//取出Marker保存的企业名称

end;

4.自动隐藏标注的标签

当用户鼠标离开Marker时，会触发MarkerMouseOut事件，在这个事件中隐藏标签，代码如下：

procedure TGaoDeMapForm.CCuniGUIAMap1MarkerMouseOut(const ASender: TObject;
  const AMarker: TCCuniGUIAMap.TMarker; const ALngLat: TLngLat;
const AEventParams: TUniStrings);
begin
  var
  AText := self.CCuniGUIAMap1.Texts.Items[0];
  AText.Hide;//mouse离开标注时，隐藏标签
end;

OK，现在标注的标签可以自动显示与隐藏了！