首页/新闻资讯/正文详情

Geoscene / ArcGIS 前端文字标注不显示问题排查与本地字体方案

发布时间:2026/9/25 4:10:54 来源:云帆数科 栏目:资讯中心
Geoscene / ArcGIS 前端文字标注不显示问题排查与本地字体方案
在使用 Geoscene或 ArcGIS JS API 体系进行地图开发时经常会遇到一个典型问题❗点位可以正常渲染但文字标注TextSymbol无法显示本文结合实际开发中的踩坑经历总结问题原因及最终通过本地字体pbf托管解决方案彻底修复该问题的方法。 一、问题现象在地图中使用TextSymbol或 labeling 时出现以下情况✔ 点Graphic正常显示❌ 文本标注不显示❌ 控制台出现字体加载失败控制台报错如下GET https://doc.geoscene.cn/resources/fonts/arial-unicode-ms-regular/xxxxx.pbf net::ERR_NAME_NOT_RESOLVED并伴随警告Couldnt find font simsun-regular. Falling back to Arial Unicode MS Regular 二、问题本质原因Geoscene / ArcGIS 的文字渲染机制并不是使用浏览器字体而是❗基于 WebGL glyph.pbf字体切片渲染也就是说 文字渲染流程TextSymbol → glyph请求pbf → 字体服务器 → WebGL渲染 核心问题点❌ 1. 默认字体依赖远程服务器默认字体资源来自https://doc.geoscene.cn/resources/fonts/如果网络不可访问DNS失败 / 内网环境 / 被墙就会导致字体无法加载文本无法渲染❌ 2. 字体不是系统字体即使写font:{family:Arial}也不会使用系统字体而是 仍然会去请求对应的 pbf 字体资源❌ 3. 缺少 glyph 区间中文字符依赖 Unicode 分片例如19968-20223.pbf 20224-20479.pbf缺失任意区间都会导致❌ 部分汉字直接不显示无报错 三、解决方案本地字体托管核心方案 思路将字体资源从远程迁移到本地项目中doc.geoscene.cn → 本地 /public/fonts 四、本地字体目录结构推荐结构如下public/ fonts/ arial-unicode-ms-regular/0-255.pbf256-511.pbf...19968-20223.pbf或中文优化版本public/fonts/simsun-regular/⚙️ 五、关键配置必须在地图初始化前设置importesriConfigfromgeoscene/config;esriConfig.fontsUrl/fonts; 六、TextSymbol 正确写法importTextSymbolfromgeoscene/symbols/TextSymbol;constsymbolnewTextSymbol({text:朝阳区,color:black,font:{family:simsun-regular,size:12}}); 七、字体下载方案关键步骤由于官方不提供完整打包下载需要手动拉取 pbf 文件。 方法1wget 批量下载wget-r-np-nH--cut-dirs3\https://doc.geoscene.cn/resources/fonts/simsun-regular/ 方法2Node 脚本下载推荐通过脚本批量下载 Unicode 区间Node 脚本下载参考步骤自动下载 pbf自动重试支持断点恢复可生成精简字体包⚠️ 八、常见坑总结❌ 坑1只改 TextSymbol 不生效 错误认知换 font.family Arial 就能显示✔ 实际必须字体 pbf 成功加载❌ 坑2assetsPath ≠ fontsUrlesriConfig.assetsPath/assets;❌ 不管字体 esriConfig.fontsUrl/fonts;✔ 控制字体❌ 坑3缺少中文 Unicode 区间必须包含19968–21247否则中文会“部分消失” 九、优化方案生产级建议✔ 推荐字体组合字体作用simsun-regular中文主字体arial-unicode-ms英文/兜底✔ 推荐结构/public/fonts/ simsun-regular/ arial-unicode-ms-regular/✔ 推荐配置esriConfig.fontsUrl/fonts; 十、最终总结Geoscene / ArcGIS 前端文字不显示的本质原因是❗字体不是系统字体而是依赖 pbf glyph 文件加载解决方案核心只有一句话✔ 将 fonts 资源本地化并通过 fontsUrl 指向本地路径

相关推荐

Java反序列化攻防本质:从CC1到CC7的机制演进
Java反序列化攻防本质:从CC1到CC7的机制演进

1. 这不是“漏洞合集”,而是一张Java反序列化攻防地图你可能在面试时被问过:“CC1和CC7有什么区别?”也可能在渗透测试报告里看到“检测到Apache Commons Collections反序列化链”,但真正能说清楚CC1为什么能绕过早期JDK黑名单、C… · 2026/9/25 4:10:48

iPhone短信导出PDF全攻略:Mac/Windows/手机三种方案详解
iPhone短信导出PDF全攻略:Mac/Windows/手机三种方案详解

开头先讲一个我上周刚遇到的场景。一位朋友在处理租房纠纷,需要把和房东的短信往来整理成一份正规档案发给物业调解。他翻遍了iPhone,发现短信App里既没有"导出"按钮,也没有"打印"选项,最后只好截图三十多张丢… · 2026/9/25 4:10:48

禁网沙箱下的邮件安全Agent:离线检测盲区与受控假网实践
禁网沙箱下的邮件安全Agent:离线检测盲区与受控假网实践

把邮件安全Agent放进禁止外网访问的沙箱,就能放心使用了吗?这个问题我几乎在每个邮件安全项目的验收会上都会听到。乍一看逻辑是闭环的:邮件是攻击入口,Agent负责分析判定,沙箱提供隔离环境,再彻底切断外网… · 2026/9/25 4:10:48

Buildah tag 命令详解:为本地镜像添加多个名称的实战指南
Buildah tag 命令详解:为本地镜像添加多个名称的实战指南

云原生 【免费下载链接】buildah A tool that facilitates building OCI images. 项目地址: https://gitcode.com/gh_mirrors/bu/buildah 点击查看 免费下载 Buildah 是一个用于构建 OCI 容器镜像的命令行工具(见主文档),buildah… · 2026/9/25 5:26:52

使用 Hugging Face Transformers 在 PyTorch 中训练语言模型:CLM / MLM / PLM 实战指南(基于 FlexGen 仓库)
使用 Hugging Face Transformers 在 PyTorch 中训练语言模型:CLM / MLM / PLM 实战指南(基于 FlexGen 仓库)

推理引擎大模型 【免费下载链接】FlexGen Running large language models on a single GPU for throughput-oriented scenarios. 项目地址: https://gitcode.com/gh_mirrors/fl/FlexGen 点击查看 免费下载 导读 本指南围绕 FlexGen 仓库 benchmark/third_party/tr… · 2026/9/25 5:26:45

WeiXinMPSDK 企业微信模块安装指南:Senparc.Weixin.Work 源码引用与 NuGet 包接入全流程
WeiXinMPSDK 企业微信模块安装指南:Senparc.Weixin.Work 源码引用与 NuGet 包接入全流程

后端即时通讯金融科技 【免费下载链接】WeiXinMPSDK 微信全平台 .NET SDK, Senparc.Weixin for C#,支持 .NET Framework 及 .NET Core、.NET 10.0。已支持微信公众号、小程序、小游戏、微信支付、企业微信/企业号、开放平台、JSSDK、微信周边等全平台。 … · 2026/9/25 5:26:45

使用 Moto 模拟 Amazon Bedrock Agents 与 Knowledge Base:完整指南
使用 Moto 模拟 Amazon Bedrock Agents 与 Knowledge Base:完整指南

Mock测试 【免费下载链接】moto A library that allows you to easily mock out tests based on AWS infrastructure. 项目地址: https://gitcode.com/gh_mirrors/mo/moto 点击查看 免费下载 Amazon Bedrock Agents(bedrock-agent)是 AWS 上… · 2026/9/25 5:26:45

opencodex V2 跨 Provider 子代理任务加密载荷丢失(NEW_TASK encrypted_content)根因分析与责任边界判定
opencodex V2 跨 Provider 子代理任务加密载荷丢失(NEW_TASK encrypted_content)根因分析与责任边界判定

【免费下载链接】opencodex Universal provider proxy for OpenAI Codex & Claude Code — use any LLM (Claude, Gemini, Grok, DeepSeek, Ollama…) with Codex CLI, App, SDK, and Claude Code 项目地址: https://gitcode.com/gh_mirrors/ope/opencodex 点击… · 2026/9/25 5:26:45

谈谈64 位的 ARM 架构
谈谈64 位的 ARM 架构

开篇:一场悄无声息的换代2013 年,iPhone 5s 发布。 发布会上苹果说了一句当时没什么人在意的话: "A7 是世界第一款 64 位手机芯片。"当时的普遍反应是: "手机内存才 1GB,要 64 位干什么?&qu… · 2026/9/25 5:26:45

数值优化(Numerical Optimization)学习系列-03-共轭梯度方法(Conjugate Gradient)
数值优化(Numerical Optimization)学习系列-03-共轭梯度方法(Conjugate Gradient)

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views … · 2026/9/25 1:00:31

创维E900V22D刷机全攻略:S905L3SB芯片兼容性解析与救砖实战
创维E900V22D刷机全攻略:S905L3SB芯片兼容性解析与救砖实战

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views … · 2026/9/25 1:00:31

MQTT协议原理与Broker服务器搭建实战:从Mosquitto到EMQX
MQTT协议原理与Broker服务器搭建实战:从Mosquitto到EMQX

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views … · 2026/9/25 1:00:37

了解更多?预约专属演示

我们的顾问将为您一对一讲解产品与方案

企业微信二维码