跳到主要内容
极客日志极客日志面向AI+效率的开发者社区
首页博客我的书AI学习GitHub 精选镜像AI工具UI配色美学关于
搜索内容 / 工具 / 仓库 / 镜像...⌘K搜索
注册
博客列表
JavaScript大前端

高德云图 WebGIS 前端技术面试真题及解析

高德云图 WebGIS 岗位的技术面试题,涵盖 WebGIS 基础(投影、数据格式、控件、软件使用)及前端核心知识(CSS 布局、HTTP 状态码、存储方案、构建工具、异步机制、Vue 原理、性能优化)。内容旨在帮助求职者复盘知识点,应对面试挑战。

CryptoLab发布于 2026/4/6更新于 2026/10/23112 浏览
高德云图 WebGIS 前端技术面试真题及解析

WebGIS 基础

1. 平常网页地图用的什么投影

绝大多数用的是 Web 墨卡托投影,编码为 EPSG:3857。几乎所有主流在线地图服务(如高德、百度、腾讯、谷歌、必应)都使用这种投影,兼容性最好。

2. 平常网页地图有什么数据;矢量和栅格,用什么格式

第一类是底图数据,通常是瓦片,即切好的图片。 第二类是业务数据。前端开发最常用的是 GeoJSON 格式,基于 JSON,轻量且易解析。另有 Shapefile 等 GIS 专用格式,通常需转换为 GeoJSON 或切片后使用。

3. WebGIS 的一些控件和内容

常用控件包括:缩放控件、比例尺、鹰眼控件、图层切换器、图例。 核心内容包括:图层管理、空间查询(点选查属性)、地图量算(测距测面)及数据可视化(热力图、轨迹回放)。

4. 知道 ArcGIS 和 QGIS 吗?怎么用的?

ArcGIS 是 ESRI 的商业软件全家桶。通常用 ArcGIS Pro(或 ArcMap)做数据处理和制图,然后用 ArcGIS Server 发布服务,前端通过 API 调用。 QGIS 是开源免费的桌面端软件。功能和 ArcGIS 类似,主要用于数据处理、格式转换和简单分析,因免费且插件丰富而常用。

前端基础

5. 如何实现元素垂直居中

主要用 Flex 布局,给父盒子设 display: flex; align-items: center; justify-content: center;。若不确定宽高,也可用绝对定位配合 transform: translate(-50%, -50%)。

6. CSS 怎么实现两个元素重叠 点击响应下方元素

重叠可用绝对定位。要点击下方元素,给上层元素加 CSS 属性:pointer-events: none;。这样鼠标事件会穿透上层元素,直接作用到下层。

7. HTTPS 状态码

HTTP 状态码说明:

  • 200:成功
  • 301/302:重定向
  • 304:缓存命中
  • 404:找不到资源
  • 401:未授权
  • 403:禁止访问
  • 500:服务器内部错误

8. 前端储存

  • Cookie:容量小(4KB),请求自动携带,适合存 Token。
  • LocalStorage:容量大(5MB),永久存储,适合用户偏好。
  • SessionStorage:容量 5MB,页面关闭失效,适合临时数据。

9. Webpack 打包

Webpack 打包涉及入口配置、Loader 处理和 Plugin 插件扩展。通过 Tree Shaking 去除死代码,利用 Code Splitting 实现懒加载,能有效优化构建产物体积和加载速度。

10. 异步调用;宏任务和微任务的实现顺序

主流推荐使用 async/await,它是 Promise 的语法糖,写法清晰,支持 try/catch 捕获错误,解决了回调地狱问题。

11. 知道 JSONP 吗

一种跨域解决方案。利用 <script> 标签不受同源策略限制的特点,动态创建 script 标签,后端返回函数调用,前端执行回调获取数据。仅支持 GET 请求,现多用 CORS 解决。

12. Vue 中双向数据绑定怎么实现的

Vue 2 用 Object.defineProperty 进行数据劫持,配合发布 - 订阅模式。Vue 3 改用 Proxy 代理,性能更好,能监听属性新增和删除。

13. 防抖和节流

用于优化性能,限制高频事件触发次数。

  • 防抖(Debounce):触发后延迟执行,期间再次触发则重新计时。如搜索联想。
  • 节流(Throttle):固定频率执行,不管触发多频繁。如滚动加载更多。

目录

  1. WebGIS 基础
  2. 1. 平常网页地图用的什么投影
  3. 2. 平常网页地图有什么数据;矢量和栅格,用什么格式
  4. 3. WebGIS 的一些控件和内容
  5. 4. 知道 ArcGIS 和 QGIS 吗?怎么用的?
  6. 前端基础
  7. 5. 如何实现元素垂直居中
  8. 6. CSS 怎么实现两个元素重叠 点击响应下方元素
  9. 7. HTTPS 状态码
  10. 8. 前端储存
  11. 9. Webpack 打包
  12. 10. 异步调用;宏任务和微任务的实现顺序
  13. 11. 知道 JSONP 吗
  14. 12. Vue 中双向数据绑定怎么实现的
  15. 13. 防抖和节流

更多推荐文章

查看全部
  • RISC-V 开源处理器实战:从 Verilog RTL 设计到 FPGA 原型验证
  • gflags 与 spdlog 实战:C++ 命令行参数与高性能日志搭配
  • Windows 11 环境下通过命令行升级 Python 版本的方法
  • 深度学习在正常与老年性黄斑变性 OCT 图像分类中的有效性分析
  • 前端防录屏原理:EME(加密媒体扩展)DRM 实战代码
  • 使用 OVITO-Python 进行 LAMMPS 后处理:统计 Type=1 原子沿 X 方向密度分布
  • GitHub Copilot 学生身份认证流程与材料准备指南
  • AI 绘画提示词网站:从技术选型到生产部署
  • 数据结构:二叉树基础与链式存储实现
  • 飞书与 OpenClaw 接入指南:无需服务器通过长连接运行机器人
  • SeaTunnel 数据集成实战:多场景数据同步配置指南
  • 链表的基本概念与结构实现
  • 基于 Django 构建 Python 监控系统
  • 华为 Eve 高效多模态视觉语言模型技术解析
  • ROS2 机器人避障实战:从传感器融合到动态窗口法
  • C++ 类大小计算:内存对齐、虚函数与继承详解
  • Self-supervised Learning of Person-specific Facial Dynamics for APR 论文阅读
  • 前端开发者 Agent 工程化开发学习路线
  • 深入理解 Flash 磨损均衡算法
  • LangChain 实战指南:9 个典型应用场景

相关免费在线工具

  • Keycode 信息

    查找任何按下的键的javascript键代码、代码、位置和修饰符。 在线工具,Keycode 信息在线工具,online

  • Escape 与 Native 编解码

    JavaScript 字符串转义/反转义;Java 风格 \uXXXX(Native2Ascii)编码与解码。 在线工具,Escape 与 Native 编解码在线工具,online

  • JavaScript / HTML 格式化

    使用 Prettier 在浏览器内格式化 JavaScript 或 HTML 片段。 在线工具,JavaScript / HTML 格式化在线工具,online

  • JavaScript 压缩与混淆

    Terser 压缩、变量名混淆,或 javascript-obfuscator 高强度混淆(体积会增大)。 在线工具,JavaScript 压缩与混淆在线工具,online

  • Base64 字符串编码/解码

    将字符串编码和解码为其 Base64 格式表示形式即可。 在线工具,Base64 字符串编码/解码在线工具,online

  • Base64 文件转换器

    将字符串、文件或图像转换为其 Base64 表示形式。 在线工具,Base64 文件转换器在线工具,online