使用高德地图LabelsLayer实现高性能海量点标注
当需要在地图上展示大量标记(如超过500个)时,传统的 Marker 标注方式容易导致页面卡顿、响应迟缓。为解决这一问题,推荐采用高德地图的 LabelsLayer 图层结合 LabelMarker 实现高效渲染。该方案适用于万级标注场景,具备出色的性能表现。
定义添加LabelMarker的方法
首先封装一个通用函数,用于向指定图层添加带图标文本的标注:
function TMapFrame.CreateLabelMarker(
ALayer: TCCuniGUIAMap.TLabelsLayer;
ALng, ALat: Double;
ATitle: string
): TCCuniGUIAMap.TLabelMarker;
begin
Result := ALayer.LabelMarkers.Add;
with Result.Options do
begin
// 设置图标资源路径
Icon.Image := '/assets/pin_32x32.png';
// 定义图标显示尺寸
with Icon.Size do
begin
Width := 32;
Height := 32;
end;
// 设置标注名称与自定义参数
Name := ATitle;
CustomParams.Values['label'] := ATitle;
// 指定经纬度位置
with Position do
begin
Lng := ALng;
Lat := ALat;
end;
end;
end;
初始化标签图层(LabelsLayer)
在地图初始化完成后创建独立的标注图层,便于后续统一管理显示/隐藏和清空操作。此过程应在 OnMapReady 事件中执行,确保地图对象已就绪:
procedure TMapFrame.CCuniGUIAMap1MapReady(Sender: TObject);
var
NewLayer: TCCuniGUIAMap.TLabelsLayer;
begin
// 创建新的标签图层
NewLayer := CCuniGUIAMap1.LabelsLayers.Add;
with NewLayer.Options do
begin
// 设置缩放级别可见范围
Zooms.Min := 3;
Zooms.Max := 20;
// 设置图层层级,避免被其他覆盖
ZIndex := 2;
// 关闭碰撞检测以提升渲染效率
Collision := False;
AllowCollision := False;
end;
// 将图层挂载至地图实例
NewLayer.AddToMap;
end;
批量绘制标注数据
通过遍历数据集循环调用 CreateLabelMarker 方法,在图层上生成多个标注。注意:所有标注添加完毕后必须显式调用 AddLabelMarkersToLayer 才能生效。
procedure TMapFrame.RenderMassLabels;
var
DataLayer: TCCuniGUIAMap.TLabelsLayer;
Marker: TCCuniGUIAMap.TLabelMarker;
begin
// 获取第一个标签图层
DataLayer := CCuniGUIAMap1.LabelsLayers[0];
DataLayer.Clear; // 清除已有标注
// 假设 q 是已打开的数据集
q.First;
while not q.Eof do
begin
CreateLabelMarker(
DataLayer,
q.FieldByName('Longitude').AsFloat,
q.FieldByName('Latitude').AsFloat,
q.FieldByName('SiteName').AsString
);
q.Next;
end;
// 提交标注至图层进行渲染
DataLayer.AddLabelMarkersToLayer;
// 自动调整视野以包含所有标注
CCuniGUIAMap1.SetFitView;
// 显示图层内容
DataLayer.Show;
end;
上述实现可在极短时间内完成上万个标注的加载与显示,实测性能优异,界面流畅无卡顿。适合用于物流网点、设备监控、门店分布等大数据量地理可视化场景。