经纬志
首页 / MapLibre / API 文档

getSource

先看结论

按 id 取回已注册的数据源对象,用于运行期更新数据、读取聚合信息或调整源参数。

最后验证 2026-11-03 · MapLibre GL JS 4.x · 更新 2026-10-29 · 引用本文
map.getSource(id) → Source | undefined

取回的是源对象本身,不是数据副本;改它的属性或调用它的方法会直接作用到地图上。

参数与返回

参数类型说明
idstring调用 addSource 时使用的 id

id 不存在、样式尚未加载完成、或源已被移除时返回 undefined。 样式加载完成前调用是最常见的空值来源。

各类源的可用方法

源类型常用方法
geojsonsetData(data)、getData()、getClusterExpansionZoom(id)、setClusterOptions(options)
vector无数据写入接口,内容更新靠重新设置样式或替换源
rastersetTiles(urls)、setUrl(url)
imagesetCoordinates(coords)、updateImage(options)
videogetVideo()、setCoordinates(coords)
canvasgetCanvas()、setCoordinates(coords)

先判空再更新

function updateCities(featureCollection) {
  var src = map.getSource('cities');

  if (!src) {
    console.warn('cities 源尚未就绪');
    return;
  }

  src.setData(featureCollection);
}

setData 是全量替换,调用后相关图层自动重绘。 数据更新频繁时,先把多次修改合并,再按 200–500 毫秒的节奏推送。

源与图层是两回事

对象创建方式能做什么
源map.addSource(id, spec)换数据、改瓦片地址、读聚合信息
图层map.addLayer(spec)改样式、过滤、层级顺序

同一个源可以挂多个图层:一份行政区 GeoJSON 既能做填充,也能做边界线。 更新源数据时所有相关图层一起变化,不需要逐个处理。

检查加载状态

if (map.isSourceLoaded('districts')) {
  console.log('当前视野内的瓦片已加载');
}

map.on('sourcedata', function (e) {
  if (e.sourceId === 'districts' && e.isSourceLoaded) {
    console.log('源数据就绪');
  }
});

isSourceLoaded 只反映当前需要渲染的瓦片,不代表整个数据集都到了。 矢量源尤其如此,视野外的瓦片尚未请求。

setStyle 会重建数据源。 新样式加载时旧的源对象通常已被销毁,之前缓存的 getSource 结果再调用 setData 不会有效果。 样式切换完成后重新取一次。

引用本文

经纬志(2026)。《getSource》。https://www.jingweizhi.com/maplibre/api/get-source.html(访问日期 2026-11-03)。