MapLibre/MapBox配置glyphs后仍报错：text-field需style的glyphs属性

错误原因 #

你误将包含glyphs配置的样式文件作为矢量数据源加载，而MapLibre/Mapbox仅会读取地图全局style中的glyphs属性，数据源配置里的glyphs不会被解析生效，因此出现text-field requires a style glyphs property错误。

解决方案 #

1. 修正矢量数据源的加载方式 #

你的style_cadastre.json不应该作为数据源的URL，直接指向矢量瓦片服务地址即可：

map.addSource('parcelle', {
  type: 'vector',
  url: 'https://myurl/mydata/{z}/{x}/{y}.pbf' // 矢量瓦片服务地址
});

2. 在地图全局style中配置glyphs #

方式一：初始化地图时设置

const map = new maplibregl.Map({
  container: 'map',
  style: {
    version: 8, // 必须指定style版本，通常为8
    glyphs: 'https://demotiles.maplibre.org/font/{fontstack}/{range}.pbf',
    sources: {},
    layers: []
  },
  center: [你的中心坐标],
  zoom: 10
});

方式二：后续通过setStyle设置

map.setStyle({
  version: 8,
  glyphs: 'https://demotiles.maplibre.org/font/{fontstack}/{range}.pbf',
  sources: {
    parcelle: {
      type: 'vector',
      url: 'https://myurl/mydata/{z}/{x}/{y}.pbf'
    }
  },
  layers: [
    // 你的其他图层配置，包括parcelles_ly
  ]
});

3. 额外排查项 #

• 确认text-font中指定的sarala字体在你使用的glyph服务中存在，若不确定，可先替换为通用字体如['Open Sans Regular']测试。
• 检查glyph服务的CORS配置，确保页面域名能正常请求该资源，可通过浏览器控制台Network标签查看请求状态。

内容的提问来源于stack exchange，提问作者Sylvain